@easy-editor/setters 0.0.2 → 0.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -1,6 +1,9 @@
1
1
  import * as React from 'react';
2
2
  import React__default, { useState, useRef } from 'react';
3
3
  import { Slot } from '@radix-ui/react-slot';
4
+ import { cva } from 'class-variance-authority';
5
+ import { clsx } from 'clsx';
6
+ import { twMerge } from 'tailwind-merge';
4
7
  import { jsx, jsxs } from 'react/jsx-runtime';
5
8
  import * as PopoverPrimitive from '@radix-ui/react-popover';
6
9
  import Sketch from '@uiw/react-color-sketch';
@@ -8,3084 +11,6 @@ import * as SwitchPrimitive from '@radix-ui/react-switch';
8
11
  import { Upload, X, ChevronsUpDown } from 'lucide-react';
9
12
  import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
10
13
  import * as TabsPrimitive from '@radix-ui/react-tabs';
11
- import * as LabelPrimitive from '@radix-ui/react-label';
12
-
13
- function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
14
-
15
- const falsyToString = (value)=>typeof value === "boolean" ? `${value}` : value === 0 ? "0" : value;
16
- const cx = clsx;
17
- const cva = (base, config)=>(props)=>{
18
- var _config_compoundVariants;
19
- if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);
20
- const { variants, defaultVariants } = config;
21
- const getVariantClassNames = Object.keys(variants).map((variant)=>{
22
- const variantProp = props === null || props === void 0 ? void 0 : props[variant];
23
- const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];
24
- if (variantProp === null) return null;
25
- const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);
26
- return variants[variant][variantKey];
27
- });
28
- const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{
29
- let [key, value] = param;
30
- if (value === undefined) {
31
- return acc;
32
- }
33
- acc[key] = value;
34
- return acc;
35
- }, {});
36
- const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{
37
- let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;
38
- return Object.entries(compoundVariantOptions).every((param)=>{
39
- let [key, value] = param;
40
- return Array.isArray(value) ? value.includes({
41
- ...defaultVariants,
42
- ...propsWithoutUndefined
43
- }[key]) : ({
44
- ...defaultVariants,
45
- ...propsWithoutUndefined
46
- })[key] === value;
47
- }) ? [
48
- ...acc,
49
- cvClass,
50
- cvClassName
51
- ] : acc;
52
- }, []);
53
- return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);
54
- };
55
-
56
- /**
57
- * Concatenates two arrays faster than the array spread operator.
58
- */
59
- const concatArrays = (array1, array2) => {
60
- // Pre-allocate for better V8 optimization
61
- const combinedArray = new Array(array1.length + array2.length);
62
- for (let i = 0; i < array1.length; i++) {
63
- combinedArray[i] = array1[i];
64
- }
65
- for (let i = 0; i < array2.length; i++) {
66
- combinedArray[array1.length + i] = array2[i];
67
- }
68
- return combinedArray;
69
- };
70
-
71
- // Factory function ensures consistent object shapes
72
- const createClassValidatorObject = (classGroupId, validator) => ({
73
- classGroupId,
74
- validator
75
- });
76
- // Factory ensures consistent ClassPartObject shape
77
- const createClassPartObject = (nextPart = new Map(), validators = null, classGroupId) => ({
78
- nextPart,
79
- validators,
80
- classGroupId
81
- });
82
- const CLASS_PART_SEPARATOR = '-';
83
- const EMPTY_CONFLICTS = [];
84
- // I use two dots here because one dot is used as prefix for class groups in plugins
85
- const ARBITRARY_PROPERTY_PREFIX = 'arbitrary..';
86
- const createClassGroupUtils = config => {
87
- const classMap = createClassMap(config);
88
- const {
89
- conflictingClassGroups,
90
- conflictingClassGroupModifiers
91
- } = config;
92
- const getClassGroupId = className => {
93
- if (className.startsWith('[') && className.endsWith(']')) {
94
- return getGroupIdForArbitraryProperty(className);
95
- }
96
- const classParts = className.split(CLASS_PART_SEPARATOR);
97
- // Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and skip it.
98
- const startIndex = classParts[0] === '' && classParts.length > 1 ? 1 : 0;
99
- return getGroupRecursive(classParts, startIndex, classMap);
100
- };
101
- const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
102
- if (hasPostfixModifier) {
103
- const modifierConflicts = conflictingClassGroupModifiers[classGroupId];
104
- const baseConflicts = conflictingClassGroups[classGroupId];
105
- if (modifierConflicts) {
106
- if (baseConflicts) {
107
- // Merge base conflicts with modifier conflicts
108
- return concatArrays(baseConflicts, modifierConflicts);
109
- }
110
- // Only modifier conflicts
111
- return modifierConflicts;
112
- }
113
- // Fall back to without postfix if no modifier conflicts
114
- return baseConflicts || EMPTY_CONFLICTS;
115
- }
116
- return conflictingClassGroups[classGroupId] || EMPTY_CONFLICTS;
117
- };
118
- return {
119
- getClassGroupId,
120
- getConflictingClassGroupIds
121
- };
122
- };
123
- const getGroupRecursive = (classParts, startIndex, classPartObject) => {
124
- const classPathsLength = classParts.length - startIndex;
125
- if (classPathsLength === 0) {
126
- return classPartObject.classGroupId;
127
- }
128
- const currentClassPart = classParts[startIndex];
129
- const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
130
- if (nextClassPartObject) {
131
- const result = getGroupRecursive(classParts, startIndex + 1, nextClassPartObject);
132
- if (result) return result;
133
- }
134
- const validators = classPartObject.validators;
135
- if (validators === null) {
136
- return undefined;
137
- }
138
- // Build classRest string efficiently by joining from startIndex onwards
139
- const classRest = startIndex === 0 ? classParts.join(CLASS_PART_SEPARATOR) : classParts.slice(startIndex).join(CLASS_PART_SEPARATOR);
140
- const validatorsLength = validators.length;
141
- for (let i = 0; i < validatorsLength; i++) {
142
- const validatorObj = validators[i];
143
- if (validatorObj.validator(classRest)) {
144
- return validatorObj.classGroupId;
145
- }
146
- }
147
- return undefined;
148
- };
149
- /**
150
- * Get the class group ID for an arbitrary property.
151
- *
152
- * @param className - The class name to get the group ID for. Is expected to be string starting with `[` and ending with `]`.
153
- */
154
- const getGroupIdForArbitraryProperty = className => className.slice(1, -1).indexOf(':') === -1 ? undefined : (() => {
155
- const content = className.slice(1, -1);
156
- const colonIndex = content.indexOf(':');
157
- const property = content.slice(0, colonIndex);
158
- return property ? ARBITRARY_PROPERTY_PREFIX + property : undefined;
159
- })();
160
- /**
161
- * Exported for testing only
162
- */
163
- const createClassMap = config => {
164
- const {
165
- theme,
166
- classGroups
167
- } = config;
168
- return processClassGroups(classGroups, theme);
169
- };
170
- // Split into separate functions to maintain monomorphic call sites
171
- const processClassGroups = (classGroups, theme) => {
172
- const classMap = createClassPartObject();
173
- for (const classGroupId in classGroups) {
174
- const group = classGroups[classGroupId];
175
- processClassesRecursively(group, classMap, classGroupId, theme);
176
- }
177
- return classMap;
178
- };
179
- const processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
180
- const len = classGroup.length;
181
- for (let i = 0; i < len; i++) {
182
- const classDefinition = classGroup[i];
183
- processClassDefinition(classDefinition, classPartObject, classGroupId, theme);
184
- }
185
- };
186
- // Split into separate functions for each type to maintain monomorphic call sites
187
- const processClassDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
188
- if (typeof classDefinition === 'string') {
189
- processStringDefinition(classDefinition, classPartObject, classGroupId);
190
- return;
191
- }
192
- if (typeof classDefinition === 'function') {
193
- processFunctionDefinition(classDefinition, classPartObject, classGroupId, theme);
194
- return;
195
- }
196
- processObjectDefinition(classDefinition, classPartObject, classGroupId, theme);
197
- };
198
- const processStringDefinition = (classDefinition, classPartObject, classGroupId) => {
199
- const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
200
- classPartObjectToEdit.classGroupId = classGroupId;
201
- };
202
- const processFunctionDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
203
- if (isThemeGetter(classDefinition)) {
204
- processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
205
- return;
206
- }
207
- if (classPartObject.validators === null) {
208
- classPartObject.validators = [];
209
- }
210
- classPartObject.validators.push(createClassValidatorObject(classGroupId, classDefinition));
211
- };
212
- const processObjectDefinition = (classDefinition, classPartObject, classGroupId, theme) => {
213
- const entries = Object.entries(classDefinition);
214
- const len = entries.length;
215
- for (let i = 0; i < len; i++) {
216
- const [key, value] = entries[i];
217
- processClassesRecursively(value, getPart(classPartObject, key), classGroupId, theme);
218
- }
219
- };
220
- const getPart = (classPartObject, path) => {
221
- let current = classPartObject;
222
- const parts = path.split(CLASS_PART_SEPARATOR);
223
- const len = parts.length;
224
- for (let i = 0; i < len; i++) {
225
- const part = parts[i];
226
- let next = current.nextPart.get(part);
227
- if (!next) {
228
- next = createClassPartObject();
229
- current.nextPart.set(part, next);
230
- }
231
- current = next;
232
- }
233
- return current;
234
- };
235
- // Type guard maintains monomorphic check
236
- const isThemeGetter = func => 'isThemeGetter' in func && func.isThemeGetter === true;
237
-
238
- // LRU cache implementation using plain objects for simplicity
239
- const createLruCache = maxCacheSize => {
240
- if (maxCacheSize < 1) {
241
- return {
242
- get: () => undefined,
243
- set: () => {}
244
- };
245
- }
246
- let cacheSize = 0;
247
- let cache = Object.create(null);
248
- let previousCache = Object.create(null);
249
- const update = (key, value) => {
250
- cache[key] = value;
251
- cacheSize++;
252
- if (cacheSize > maxCacheSize) {
253
- cacheSize = 0;
254
- previousCache = cache;
255
- cache = Object.create(null);
256
- }
257
- };
258
- return {
259
- get(key) {
260
- let value = cache[key];
261
- if (value !== undefined) {
262
- return value;
263
- }
264
- if ((value = previousCache[key]) !== undefined) {
265
- update(key, value);
266
- return value;
267
- }
268
- },
269
- set(key, value) {
270
- if (key in cache) {
271
- cache[key] = value;
272
- } else {
273
- update(key, value);
274
- }
275
- }
276
- };
277
- };
278
- const IMPORTANT_MODIFIER = '!';
279
- const MODIFIER_SEPARATOR = ':';
280
- const EMPTY_MODIFIERS = [];
281
- // Pre-allocated result object shape for consistency
282
- const createResultObject = (modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition, isExternal) => ({
283
- modifiers,
284
- hasImportantModifier,
285
- baseClassName,
286
- maybePostfixModifierPosition,
287
- isExternal
288
- });
289
- const createParseClassName = config => {
290
- const {
291
- prefix,
292
- experimentalParseClassName
293
- } = config;
294
- /**
295
- * Parse class name into parts.
296
- *
297
- * Inspired by `splitAtTopLevelOnly` used in Tailwind CSS
298
- * @see https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
299
- */
300
- let parseClassName = className => {
301
- // Use simple array with push for better performance
302
- const modifiers = [];
303
- let bracketDepth = 0;
304
- let parenDepth = 0;
305
- let modifierStart = 0;
306
- let postfixModifierPosition;
307
- const len = className.length;
308
- for (let index = 0; index < len; index++) {
309
- const currentCharacter = className[index];
310
- if (bracketDepth === 0 && parenDepth === 0) {
311
- if (currentCharacter === MODIFIER_SEPARATOR) {
312
- modifiers.push(className.slice(modifierStart, index));
313
- modifierStart = index + 1;
314
- continue;
315
- }
316
- if (currentCharacter === '/') {
317
- postfixModifierPosition = index;
318
- continue;
319
- }
320
- }
321
- if (currentCharacter === '[') bracketDepth++;else if (currentCharacter === ']') bracketDepth--;else if (currentCharacter === '(') parenDepth++;else if (currentCharacter === ')') parenDepth--;
322
- }
323
- const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.slice(modifierStart);
324
- // Inline important modifier check
325
- let baseClassName = baseClassNameWithImportantModifier;
326
- let hasImportantModifier = false;
327
- if (baseClassNameWithImportantModifier.endsWith(IMPORTANT_MODIFIER)) {
328
- baseClassName = baseClassNameWithImportantModifier.slice(0, -1);
329
- hasImportantModifier = true;
330
- } else if (
331
- /**
332
- * In Tailwind CSS v3 the important modifier was at the start of the base class name. This is still supported for legacy reasons.
333
- * @see https://github.com/dcastil/tailwind-merge/issues/513#issuecomment-2614029864
334
- */
335
- baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER)) {
336
- baseClassName = baseClassNameWithImportantModifier.slice(1);
337
- hasImportantModifier = true;
338
- }
339
- const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
340
- return createResultObject(modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition);
341
- };
342
- if (prefix) {
343
- const fullPrefix = prefix + MODIFIER_SEPARATOR;
344
- const parseClassNameOriginal = parseClassName;
345
- parseClassName = className => className.startsWith(fullPrefix) ? parseClassNameOriginal(className.slice(fullPrefix.length)) : createResultObject(EMPTY_MODIFIERS, false, className, undefined, true);
346
- }
347
- if (experimentalParseClassName) {
348
- const parseClassNameOriginal = parseClassName;
349
- parseClassName = className => experimentalParseClassName({
350
- className,
351
- parseClassName: parseClassNameOriginal
352
- });
353
- }
354
- return parseClassName;
355
- };
356
-
357
- /**
358
- * Sorts modifiers according to following schema:
359
- * - Predefined modifiers are sorted alphabetically
360
- * - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
361
- */
362
- const createSortModifiers = config => {
363
- // Pre-compute weights for all known modifiers for O(1) comparison
364
- const modifierWeights = new Map();
365
- // Assign weights to sensitive modifiers (highest priority, but preserve order)
366
- config.orderSensitiveModifiers.forEach((mod, index) => {
367
- modifierWeights.set(mod, 1000000 + index); // High weights for sensitive mods
368
- });
369
- return modifiers => {
370
- const result = [];
371
- let currentSegment = [];
372
- // Process modifiers in one pass
373
- for (let i = 0; i < modifiers.length; i++) {
374
- const modifier = modifiers[i];
375
- // Check if modifier is sensitive (starts with '[' or in orderSensitiveModifiers)
376
- const isArbitrary = modifier[0] === '[';
377
- const isOrderSensitive = modifierWeights.has(modifier);
378
- if (isArbitrary || isOrderSensitive) {
379
- // Sort and flush current segment alphabetically
380
- if (currentSegment.length > 0) {
381
- currentSegment.sort();
382
- result.push(...currentSegment);
383
- currentSegment = [];
384
- }
385
- result.push(modifier);
386
- } else {
387
- // Regular modifier - add to current segment for batch sorting
388
- currentSegment.push(modifier);
389
- }
390
- }
391
- // Sort and add any remaining segment items
392
- if (currentSegment.length > 0) {
393
- currentSegment.sort();
394
- result.push(...currentSegment);
395
- }
396
- return result;
397
- };
398
- };
399
- const createConfigUtils = config => ({
400
- cache: createLruCache(config.cacheSize),
401
- parseClassName: createParseClassName(config),
402
- sortModifiers: createSortModifiers(config),
403
- ...createClassGroupUtils(config)
404
- });
405
- const SPLIT_CLASSES_REGEX = /\s+/;
406
- const mergeClassList = (classList, configUtils) => {
407
- const {
408
- parseClassName,
409
- getClassGroupId,
410
- getConflictingClassGroupIds,
411
- sortModifiers
412
- } = configUtils;
413
- /**
414
- * Set of classGroupIds in following format:
415
- * `{importantModifier}{variantModifiers}{classGroupId}`
416
- * @example 'float'
417
- * @example 'hover:focus:bg-color'
418
- * @example 'md:!pr'
419
- */
420
- const classGroupsInConflict = [];
421
- const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
422
- let result = '';
423
- for (let index = classNames.length - 1; index >= 0; index -= 1) {
424
- const originalClassName = classNames[index];
425
- const {
426
- isExternal,
427
- modifiers,
428
- hasImportantModifier,
429
- baseClassName,
430
- maybePostfixModifierPosition
431
- } = parseClassName(originalClassName);
432
- if (isExternal) {
433
- result = originalClassName + (result.length > 0 ? ' ' + result : result);
434
- continue;
435
- }
436
- let hasPostfixModifier = !!maybePostfixModifierPosition;
437
- let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
438
- if (!classGroupId) {
439
- if (!hasPostfixModifier) {
440
- // Not a Tailwind class
441
- result = originalClassName + (result.length > 0 ? ' ' + result : result);
442
- continue;
443
- }
444
- classGroupId = getClassGroupId(baseClassName);
445
- if (!classGroupId) {
446
- // Not a Tailwind class
447
- result = originalClassName + (result.length > 0 ? ' ' + result : result);
448
- continue;
449
- }
450
- hasPostfixModifier = false;
451
- }
452
- // Fast path: skip sorting for empty or single modifier
453
- const variantModifier = modifiers.length === 0 ? '' : modifiers.length === 1 ? modifiers[0] : sortModifiers(modifiers).join(':');
454
- const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
455
- const classId = modifierId + classGroupId;
456
- if (classGroupsInConflict.indexOf(classId) > -1) {
457
- // Tailwind class omitted due to conflict
458
- continue;
459
- }
460
- classGroupsInConflict.push(classId);
461
- const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
462
- for (let i = 0; i < conflictGroups.length; ++i) {
463
- const group = conflictGroups[i];
464
- classGroupsInConflict.push(modifierId + group);
465
- }
466
- // Tailwind class not in conflict
467
- result = originalClassName + (result.length > 0 ? ' ' + result : result);
468
- }
469
- return result;
470
- };
471
-
472
- /**
473
- * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
474
- *
475
- * Specifically:
476
- * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
477
- * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
478
- *
479
- * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
480
- */
481
- const twJoin = (...classLists) => {
482
- let index = 0;
483
- let argument;
484
- let resolvedValue;
485
- let string = '';
486
- while (index < classLists.length) {
487
- if (argument = classLists[index++]) {
488
- if (resolvedValue = toValue(argument)) {
489
- string && (string += ' ');
490
- string += resolvedValue;
491
- }
492
- }
493
- }
494
- return string;
495
- };
496
- const toValue = mix => {
497
- // Fast path for strings
498
- if (typeof mix === 'string') {
499
- return mix;
500
- }
501
- let resolvedValue;
502
- let string = '';
503
- for (let k = 0; k < mix.length; k++) {
504
- if (mix[k]) {
505
- if (resolvedValue = toValue(mix[k])) {
506
- string && (string += ' ');
507
- string += resolvedValue;
508
- }
509
- }
510
- }
511
- return string;
512
- };
513
- const createTailwindMerge = (createConfigFirst, ...createConfigRest) => {
514
- let configUtils;
515
- let cacheGet;
516
- let cacheSet;
517
- let functionToCall;
518
- const initTailwindMerge = classList => {
519
- const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
520
- configUtils = createConfigUtils(config);
521
- cacheGet = configUtils.cache.get;
522
- cacheSet = configUtils.cache.set;
523
- functionToCall = tailwindMerge;
524
- return tailwindMerge(classList);
525
- };
526
- const tailwindMerge = classList => {
527
- const cachedResult = cacheGet(classList);
528
- if (cachedResult) {
529
- return cachedResult;
530
- }
531
- const result = mergeClassList(classList, configUtils);
532
- cacheSet(classList, result);
533
- return result;
534
- };
535
- functionToCall = initTailwindMerge;
536
- return (...args) => functionToCall(twJoin(...args));
537
- };
538
- const fallbackThemeArr = [];
539
- const fromTheme = key => {
540
- const themeGetter = theme => theme[key] || fallbackThemeArr;
541
- themeGetter.isThemeGetter = true;
542
- return themeGetter;
543
- };
544
- const arbitraryValueRegex = /^\[(?:(\w[\w-]*):)?(.+)\]$/i;
545
- const arbitraryVariableRegex = /^\((?:(\w[\w-]*):)?(.+)\)$/i;
546
- const fractionRegex = /^\d+\/\d+$/;
547
- const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
548
- 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$/;
549
- const colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
550
- // Shadow always begins with x and y offset separated by underscore optionally prepended by inset
551
- const shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
552
- const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
553
- const isFraction = value => fractionRegex.test(value);
554
- const isNumber = value => !!value && !Number.isNaN(Number(value));
555
- const isInteger = value => !!value && Number.isInteger(Number(value));
556
- const isPercent = value => value.endsWith('%') && isNumber(value.slice(0, -1));
557
- const isTshirtSize = value => tshirtUnitRegex.test(value);
558
- const isAny = () => true;
559
- const isLengthOnly = value =>
560
- // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
561
- // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
562
- // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
563
- lengthUnitRegex.test(value) && !colorFunctionRegex.test(value);
564
- const isNever = () => false;
565
- const isShadow = value => shadowRegex.test(value);
566
- const isImage = value => imageRegex.test(value);
567
- const isAnyNonArbitrary = value => !isArbitraryValue(value) && !isArbitraryVariable(value);
568
- const isArbitrarySize = value => getIsArbitraryValue(value, isLabelSize, isNever);
569
- const isArbitraryValue = value => arbitraryValueRegex.test(value);
570
- const isArbitraryLength = value => getIsArbitraryValue(value, isLabelLength, isLengthOnly);
571
- const isArbitraryNumber = value => getIsArbitraryValue(value, isLabelNumber, isNumber);
572
- const isArbitraryPosition = value => getIsArbitraryValue(value, isLabelPosition, isNever);
573
- const isArbitraryImage = value => getIsArbitraryValue(value, isLabelImage, isImage);
574
- const isArbitraryShadow = value => getIsArbitraryValue(value, isLabelShadow, isShadow);
575
- const isArbitraryVariable = value => arbitraryVariableRegex.test(value);
576
- const isArbitraryVariableLength = value => getIsArbitraryVariable(value, isLabelLength);
577
- const isArbitraryVariableFamilyName = value => getIsArbitraryVariable(value, isLabelFamilyName);
578
- const isArbitraryVariablePosition = value => getIsArbitraryVariable(value, isLabelPosition);
579
- const isArbitraryVariableSize = value => getIsArbitraryVariable(value, isLabelSize);
580
- const isArbitraryVariableImage = value => getIsArbitraryVariable(value, isLabelImage);
581
- const isArbitraryVariableShadow = value => getIsArbitraryVariable(value, isLabelShadow, true);
582
- // Helpers
583
- const getIsArbitraryValue = (value, testLabel, testValue) => {
584
- const result = arbitraryValueRegex.exec(value);
585
- if (result) {
586
- if (result[1]) {
587
- return testLabel(result[1]);
588
- }
589
- return testValue(result[2]);
590
- }
591
- return false;
592
- };
593
- const getIsArbitraryVariable = (value, testLabel, shouldMatchNoLabel = false) => {
594
- const result = arbitraryVariableRegex.exec(value);
595
- if (result) {
596
- if (result[1]) {
597
- return testLabel(result[1]);
598
- }
599
- return shouldMatchNoLabel;
600
- }
601
- return false;
602
- };
603
- // Labels
604
- const isLabelPosition = label => label === 'position' || label === 'percentage';
605
- const isLabelImage = label => label === 'image' || label === 'url';
606
- const isLabelSize = label => label === 'length' || label === 'size' || label === 'bg-size';
607
- const isLabelLength = label => label === 'length';
608
- const isLabelNumber = label => label === 'number';
609
- const isLabelFamilyName = label => label === 'family-name';
610
- const isLabelShadow = label => label === 'shadow';
611
- const getDefaultConfig = () => {
612
- /**
613
- * Theme getters for theme variable namespaces
614
- * @see https://tailwindcss.com/docs/theme#theme-variable-namespaces
615
- */
616
- /***/
617
- const themeColor = fromTheme('color');
618
- const themeFont = fromTheme('font');
619
- const themeText = fromTheme('text');
620
- const themeFontWeight = fromTheme('font-weight');
621
- const themeTracking = fromTheme('tracking');
622
- const themeLeading = fromTheme('leading');
623
- const themeBreakpoint = fromTheme('breakpoint');
624
- const themeContainer = fromTheme('container');
625
- const themeSpacing = fromTheme('spacing');
626
- const themeRadius = fromTheme('radius');
627
- const themeShadow = fromTheme('shadow');
628
- const themeInsetShadow = fromTheme('inset-shadow');
629
- const themeTextShadow = fromTheme('text-shadow');
630
- const themeDropShadow = fromTheme('drop-shadow');
631
- const themeBlur = fromTheme('blur');
632
- const themePerspective = fromTheme('perspective');
633
- const themeAspect = fromTheme('aspect');
634
- const themeEase = fromTheme('ease');
635
- const themeAnimate = fromTheme('animate');
636
- /**
637
- * Helpers to avoid repeating the same scales
638
- *
639
- * We use functions that create a new array every time they're called instead of static arrays.
640
- * 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.
641
- */
642
- /***/
643
- const scaleBreak = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
644
- const scalePosition = () => ['center', 'top', 'bottom', 'left', 'right', 'top-left',
645
- // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
646
- 'left-top', 'top-right',
647
- // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
648
- 'right-top', 'bottom-right',
649
- // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
650
- 'right-bottom', 'bottom-left',
651
- // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
652
- 'left-bottom'];
653
- const scalePositionWithArbitrary = () => [...scalePosition(), isArbitraryVariable, isArbitraryValue];
654
- const scaleOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
655
- const scaleOverscroll = () => ['auto', 'contain', 'none'];
656
- const scaleUnambiguousSpacing = () => [isArbitraryVariable, isArbitraryValue, themeSpacing];
657
- const scaleInset = () => [isFraction, 'full', 'auto', ...scaleUnambiguousSpacing()];
658
- const scaleGridTemplateColsRows = () => [isInteger, 'none', 'subgrid', isArbitraryVariable, isArbitraryValue];
659
- const scaleGridColRowStartAndEnd = () => ['auto', {
660
- span: ['full', isInteger, isArbitraryVariable, isArbitraryValue]
661
- }, isInteger, isArbitraryVariable, isArbitraryValue];
662
- const scaleGridColRowStartOrEnd = () => [isInteger, 'auto', isArbitraryVariable, isArbitraryValue];
663
- const scaleGridAutoColsRows = () => ['auto', 'min', 'max', 'fr', isArbitraryVariable, isArbitraryValue];
664
- const scaleAlignPrimaryAxis = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch', 'baseline', 'center-safe', 'end-safe'];
665
- const scaleAlignSecondaryAxis = () => ['start', 'end', 'center', 'stretch', 'center-safe', 'end-safe'];
666
- const scaleMargin = () => ['auto', ...scaleUnambiguousSpacing()];
667
- const scaleSizing = () => [isFraction, 'auto', 'full', 'dvw', 'dvh', 'lvw', 'lvh', 'svw', 'svh', 'min', 'max', 'fit', ...scaleUnambiguousSpacing()];
668
- const scaleColor = () => [themeColor, isArbitraryVariable, isArbitraryValue];
669
- const scaleBgPosition = () => [...scalePosition(), isArbitraryVariablePosition, isArbitraryPosition, {
670
- position: [isArbitraryVariable, isArbitraryValue]
671
- }];
672
- const scaleBgRepeat = () => ['no-repeat', {
673
- repeat: ['', 'x', 'y', 'space', 'round']
674
- }];
675
- const scaleBgSize = () => ['auto', 'cover', 'contain', isArbitraryVariableSize, isArbitrarySize, {
676
- size: [isArbitraryVariable, isArbitraryValue]
677
- }];
678
- const scaleGradientStopPosition = () => [isPercent, isArbitraryVariableLength, isArbitraryLength];
679
- const scaleRadius = () => [
680
- // Deprecated since Tailwind CSS v4.0.0
681
- '', 'none', 'full', themeRadius, isArbitraryVariable, isArbitraryValue];
682
- const scaleBorderWidth = () => ['', isNumber, isArbitraryVariableLength, isArbitraryLength];
683
- const scaleLineStyle = () => ['solid', 'dashed', 'dotted', 'double'];
684
- const scaleBlendMode = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
685
- const scaleMaskImagePosition = () => [isNumber, isPercent, isArbitraryVariablePosition, isArbitraryPosition];
686
- const scaleBlur = () => [
687
- // Deprecated since Tailwind CSS v4.0.0
688
- '', 'none', themeBlur, isArbitraryVariable, isArbitraryValue];
689
- const scaleRotate = () => ['none', isNumber, isArbitraryVariable, isArbitraryValue];
690
- const scaleScale = () => ['none', isNumber, isArbitraryVariable, isArbitraryValue];
691
- const scaleSkew = () => [isNumber, isArbitraryVariable, isArbitraryValue];
692
- const scaleTranslate = () => [isFraction, 'full', ...scaleUnambiguousSpacing()];
693
- return {
694
- cacheSize: 500,
695
- theme: {
696
- animate: ['spin', 'ping', 'pulse', 'bounce'],
697
- aspect: ['video'],
698
- blur: [isTshirtSize],
699
- breakpoint: [isTshirtSize],
700
- color: [isAny],
701
- container: [isTshirtSize],
702
- 'drop-shadow': [isTshirtSize],
703
- ease: ['in', 'out', 'in-out'],
704
- font: [isAnyNonArbitrary],
705
- 'font-weight': ['thin', 'extralight', 'light', 'normal', 'medium', 'semibold', 'bold', 'extrabold', 'black'],
706
- 'inset-shadow': [isTshirtSize],
707
- leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose'],
708
- perspective: ['dramatic', 'near', 'normal', 'midrange', 'distant', 'none'],
709
- radius: [isTshirtSize],
710
- shadow: [isTshirtSize],
711
- spacing: ['px', isNumber],
712
- text: [isTshirtSize],
713
- 'text-shadow': [isTshirtSize],
714
- tracking: ['tighter', 'tight', 'normal', 'wide', 'wider', 'widest']
715
- },
716
- classGroups: {
717
- // --------------
718
- // --- Layout ---
719
- // --------------
720
- /**
721
- * Aspect Ratio
722
- * @see https://tailwindcss.com/docs/aspect-ratio
723
- */
724
- aspect: [{
725
- aspect: ['auto', 'square', isFraction, isArbitraryValue, isArbitraryVariable, themeAspect]
726
- }],
727
- /**
728
- * Container
729
- * @see https://tailwindcss.com/docs/container
730
- * @deprecated since Tailwind CSS v4.0.0
731
- */
732
- container: ['container'],
733
- /**
734
- * Columns
735
- * @see https://tailwindcss.com/docs/columns
736
- */
737
- columns: [{
738
- columns: [isNumber, isArbitraryValue, isArbitraryVariable, themeContainer]
739
- }],
740
- /**
741
- * Break After
742
- * @see https://tailwindcss.com/docs/break-after
743
- */
744
- 'break-after': [{
745
- 'break-after': scaleBreak()
746
- }],
747
- /**
748
- * Break Before
749
- * @see https://tailwindcss.com/docs/break-before
750
- */
751
- 'break-before': [{
752
- 'break-before': scaleBreak()
753
- }],
754
- /**
755
- * Break Inside
756
- * @see https://tailwindcss.com/docs/break-inside
757
- */
758
- 'break-inside': [{
759
- 'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column']
760
- }],
761
- /**
762
- * Box Decoration Break
763
- * @see https://tailwindcss.com/docs/box-decoration-break
764
- */
765
- 'box-decoration': [{
766
- 'box-decoration': ['slice', 'clone']
767
- }],
768
- /**
769
- * Box Sizing
770
- * @see https://tailwindcss.com/docs/box-sizing
771
- */
772
- box: [{
773
- box: ['border', 'content']
774
- }],
775
- /**
776
- * Display
777
- * @see https://tailwindcss.com/docs/display
778
- */
779
- 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'],
780
- /**
781
- * Screen Reader Only
782
- * @see https://tailwindcss.com/docs/display#screen-reader-only
783
- */
784
- sr: ['sr-only', 'not-sr-only'],
785
- /**
786
- * Floats
787
- * @see https://tailwindcss.com/docs/float
788
- */
789
- float: [{
790
- float: ['right', 'left', 'none', 'start', 'end']
791
- }],
792
- /**
793
- * Clear
794
- * @see https://tailwindcss.com/docs/clear
795
- */
796
- clear: [{
797
- clear: ['left', 'right', 'both', 'none', 'start', 'end']
798
- }],
799
- /**
800
- * Isolation
801
- * @see https://tailwindcss.com/docs/isolation
802
- */
803
- isolation: ['isolate', 'isolation-auto'],
804
- /**
805
- * Object Fit
806
- * @see https://tailwindcss.com/docs/object-fit
807
- */
808
- 'object-fit': [{
809
- object: ['contain', 'cover', 'fill', 'none', 'scale-down']
810
- }],
811
- /**
812
- * Object Position
813
- * @see https://tailwindcss.com/docs/object-position
814
- */
815
- 'object-position': [{
816
- object: scalePositionWithArbitrary()
817
- }],
818
- /**
819
- * Overflow
820
- * @see https://tailwindcss.com/docs/overflow
821
- */
822
- overflow: [{
823
- overflow: scaleOverflow()
824
- }],
825
- /**
826
- * Overflow X
827
- * @see https://tailwindcss.com/docs/overflow
828
- */
829
- 'overflow-x': [{
830
- 'overflow-x': scaleOverflow()
831
- }],
832
- /**
833
- * Overflow Y
834
- * @see https://tailwindcss.com/docs/overflow
835
- */
836
- 'overflow-y': [{
837
- 'overflow-y': scaleOverflow()
838
- }],
839
- /**
840
- * Overscroll Behavior
841
- * @see https://tailwindcss.com/docs/overscroll-behavior
842
- */
843
- overscroll: [{
844
- overscroll: scaleOverscroll()
845
- }],
846
- /**
847
- * Overscroll Behavior X
848
- * @see https://tailwindcss.com/docs/overscroll-behavior
849
- */
850
- 'overscroll-x': [{
851
- 'overscroll-x': scaleOverscroll()
852
- }],
853
- /**
854
- * Overscroll Behavior Y
855
- * @see https://tailwindcss.com/docs/overscroll-behavior
856
- */
857
- 'overscroll-y': [{
858
- 'overscroll-y': scaleOverscroll()
859
- }],
860
- /**
861
- * Position
862
- * @see https://tailwindcss.com/docs/position
863
- */
864
- position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
865
- /**
866
- * Top / Right / Bottom / Left
867
- * @see https://tailwindcss.com/docs/top-right-bottom-left
868
- */
869
- inset: [{
870
- inset: scaleInset()
871
- }],
872
- /**
873
- * Right / Left
874
- * @see https://tailwindcss.com/docs/top-right-bottom-left
875
- */
876
- 'inset-x': [{
877
- 'inset-x': scaleInset()
878
- }],
879
- /**
880
- * Top / Bottom
881
- * @see https://tailwindcss.com/docs/top-right-bottom-left
882
- */
883
- 'inset-y': [{
884
- 'inset-y': scaleInset()
885
- }],
886
- /**
887
- * Start
888
- * @see https://tailwindcss.com/docs/top-right-bottom-left
889
- */
890
- start: [{
891
- start: scaleInset()
892
- }],
893
- /**
894
- * End
895
- * @see https://tailwindcss.com/docs/top-right-bottom-left
896
- */
897
- end: [{
898
- end: scaleInset()
899
- }],
900
- /**
901
- * Top
902
- * @see https://tailwindcss.com/docs/top-right-bottom-left
903
- */
904
- top: [{
905
- top: scaleInset()
906
- }],
907
- /**
908
- * Right
909
- * @see https://tailwindcss.com/docs/top-right-bottom-left
910
- */
911
- right: [{
912
- right: scaleInset()
913
- }],
914
- /**
915
- * Bottom
916
- * @see https://tailwindcss.com/docs/top-right-bottom-left
917
- */
918
- bottom: [{
919
- bottom: scaleInset()
920
- }],
921
- /**
922
- * Left
923
- * @see https://tailwindcss.com/docs/top-right-bottom-left
924
- */
925
- left: [{
926
- left: scaleInset()
927
- }],
928
- /**
929
- * Visibility
930
- * @see https://tailwindcss.com/docs/visibility
931
- */
932
- visibility: ['visible', 'invisible', 'collapse'],
933
- /**
934
- * Z-Index
935
- * @see https://tailwindcss.com/docs/z-index
936
- */
937
- z: [{
938
- z: [isInteger, 'auto', isArbitraryVariable, isArbitraryValue]
939
- }],
940
- // ------------------------
941
- // --- Flexbox and Grid ---
942
- // ------------------------
943
- /**
944
- * Flex Basis
945
- * @see https://tailwindcss.com/docs/flex-basis
946
- */
947
- basis: [{
948
- basis: [isFraction, 'full', 'auto', themeContainer, ...scaleUnambiguousSpacing()]
949
- }],
950
- /**
951
- * Flex Direction
952
- * @see https://tailwindcss.com/docs/flex-direction
953
- */
954
- 'flex-direction': [{
955
- flex: ['row', 'row-reverse', 'col', 'col-reverse']
956
- }],
957
- /**
958
- * Flex Wrap
959
- * @see https://tailwindcss.com/docs/flex-wrap
960
- */
961
- 'flex-wrap': [{
962
- flex: ['nowrap', 'wrap', 'wrap-reverse']
963
- }],
964
- /**
965
- * Flex
966
- * @see https://tailwindcss.com/docs/flex
967
- */
968
- flex: [{
969
- flex: [isNumber, isFraction, 'auto', 'initial', 'none', isArbitraryValue]
970
- }],
971
- /**
972
- * Flex Grow
973
- * @see https://tailwindcss.com/docs/flex-grow
974
- */
975
- grow: [{
976
- grow: ['', isNumber, isArbitraryVariable, isArbitraryValue]
977
- }],
978
- /**
979
- * Flex Shrink
980
- * @see https://tailwindcss.com/docs/flex-shrink
981
- */
982
- shrink: [{
983
- shrink: ['', isNumber, isArbitraryVariable, isArbitraryValue]
984
- }],
985
- /**
986
- * Order
987
- * @see https://tailwindcss.com/docs/order
988
- */
989
- order: [{
990
- order: [isInteger, 'first', 'last', 'none', isArbitraryVariable, isArbitraryValue]
991
- }],
992
- /**
993
- * Grid Template Columns
994
- * @see https://tailwindcss.com/docs/grid-template-columns
995
- */
996
- 'grid-cols': [{
997
- 'grid-cols': scaleGridTemplateColsRows()
998
- }],
999
- /**
1000
- * Grid Column Start / End
1001
- * @see https://tailwindcss.com/docs/grid-column
1002
- */
1003
- 'col-start-end': [{
1004
- col: scaleGridColRowStartAndEnd()
1005
- }],
1006
- /**
1007
- * Grid Column Start
1008
- * @see https://tailwindcss.com/docs/grid-column
1009
- */
1010
- 'col-start': [{
1011
- 'col-start': scaleGridColRowStartOrEnd()
1012
- }],
1013
- /**
1014
- * Grid Column End
1015
- * @see https://tailwindcss.com/docs/grid-column
1016
- */
1017
- 'col-end': [{
1018
- 'col-end': scaleGridColRowStartOrEnd()
1019
- }],
1020
- /**
1021
- * Grid Template Rows
1022
- * @see https://tailwindcss.com/docs/grid-template-rows
1023
- */
1024
- 'grid-rows': [{
1025
- 'grid-rows': scaleGridTemplateColsRows()
1026
- }],
1027
- /**
1028
- * Grid Row Start / End
1029
- * @see https://tailwindcss.com/docs/grid-row
1030
- */
1031
- 'row-start-end': [{
1032
- row: scaleGridColRowStartAndEnd()
1033
- }],
1034
- /**
1035
- * Grid Row Start
1036
- * @see https://tailwindcss.com/docs/grid-row
1037
- */
1038
- 'row-start': [{
1039
- 'row-start': scaleGridColRowStartOrEnd()
1040
- }],
1041
- /**
1042
- * Grid Row End
1043
- * @see https://tailwindcss.com/docs/grid-row
1044
- */
1045
- 'row-end': [{
1046
- 'row-end': scaleGridColRowStartOrEnd()
1047
- }],
1048
- /**
1049
- * Grid Auto Flow
1050
- * @see https://tailwindcss.com/docs/grid-auto-flow
1051
- */
1052
- 'grid-flow': [{
1053
- 'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense']
1054
- }],
1055
- /**
1056
- * Grid Auto Columns
1057
- * @see https://tailwindcss.com/docs/grid-auto-columns
1058
- */
1059
- 'auto-cols': [{
1060
- 'auto-cols': scaleGridAutoColsRows()
1061
- }],
1062
- /**
1063
- * Grid Auto Rows
1064
- * @see https://tailwindcss.com/docs/grid-auto-rows
1065
- */
1066
- 'auto-rows': [{
1067
- 'auto-rows': scaleGridAutoColsRows()
1068
- }],
1069
- /**
1070
- * Gap
1071
- * @see https://tailwindcss.com/docs/gap
1072
- */
1073
- gap: [{
1074
- gap: scaleUnambiguousSpacing()
1075
- }],
1076
- /**
1077
- * Gap X
1078
- * @see https://tailwindcss.com/docs/gap
1079
- */
1080
- 'gap-x': [{
1081
- 'gap-x': scaleUnambiguousSpacing()
1082
- }],
1083
- /**
1084
- * Gap Y
1085
- * @see https://tailwindcss.com/docs/gap
1086
- */
1087
- 'gap-y': [{
1088
- 'gap-y': scaleUnambiguousSpacing()
1089
- }],
1090
- /**
1091
- * Justify Content
1092
- * @see https://tailwindcss.com/docs/justify-content
1093
- */
1094
- 'justify-content': [{
1095
- justify: [...scaleAlignPrimaryAxis(), 'normal']
1096
- }],
1097
- /**
1098
- * Justify Items
1099
- * @see https://tailwindcss.com/docs/justify-items
1100
- */
1101
- 'justify-items': [{
1102
- 'justify-items': [...scaleAlignSecondaryAxis(), 'normal']
1103
- }],
1104
- /**
1105
- * Justify Self
1106
- * @see https://tailwindcss.com/docs/justify-self
1107
- */
1108
- 'justify-self': [{
1109
- 'justify-self': ['auto', ...scaleAlignSecondaryAxis()]
1110
- }],
1111
- /**
1112
- * Align Content
1113
- * @see https://tailwindcss.com/docs/align-content
1114
- */
1115
- 'align-content': [{
1116
- content: ['normal', ...scaleAlignPrimaryAxis()]
1117
- }],
1118
- /**
1119
- * Align Items
1120
- * @see https://tailwindcss.com/docs/align-items
1121
- */
1122
- 'align-items': [{
1123
- items: [...scaleAlignSecondaryAxis(), {
1124
- baseline: ['', 'last']
1125
- }]
1126
- }],
1127
- /**
1128
- * Align Self
1129
- * @see https://tailwindcss.com/docs/align-self
1130
- */
1131
- 'align-self': [{
1132
- self: ['auto', ...scaleAlignSecondaryAxis(), {
1133
- baseline: ['', 'last']
1134
- }]
1135
- }],
1136
- /**
1137
- * Place Content
1138
- * @see https://tailwindcss.com/docs/place-content
1139
- */
1140
- 'place-content': [{
1141
- 'place-content': scaleAlignPrimaryAxis()
1142
- }],
1143
- /**
1144
- * Place Items
1145
- * @see https://tailwindcss.com/docs/place-items
1146
- */
1147
- 'place-items': [{
1148
- 'place-items': [...scaleAlignSecondaryAxis(), 'baseline']
1149
- }],
1150
- /**
1151
- * Place Self
1152
- * @see https://tailwindcss.com/docs/place-self
1153
- */
1154
- 'place-self': [{
1155
- 'place-self': ['auto', ...scaleAlignSecondaryAxis()]
1156
- }],
1157
- // Spacing
1158
- /**
1159
- * Padding
1160
- * @see https://tailwindcss.com/docs/padding
1161
- */
1162
- p: [{
1163
- p: scaleUnambiguousSpacing()
1164
- }],
1165
- /**
1166
- * Padding X
1167
- * @see https://tailwindcss.com/docs/padding
1168
- */
1169
- px: [{
1170
- px: scaleUnambiguousSpacing()
1171
- }],
1172
- /**
1173
- * Padding Y
1174
- * @see https://tailwindcss.com/docs/padding
1175
- */
1176
- py: [{
1177
- py: scaleUnambiguousSpacing()
1178
- }],
1179
- /**
1180
- * Padding Start
1181
- * @see https://tailwindcss.com/docs/padding
1182
- */
1183
- ps: [{
1184
- ps: scaleUnambiguousSpacing()
1185
- }],
1186
- /**
1187
- * Padding End
1188
- * @see https://tailwindcss.com/docs/padding
1189
- */
1190
- pe: [{
1191
- pe: scaleUnambiguousSpacing()
1192
- }],
1193
- /**
1194
- * Padding Top
1195
- * @see https://tailwindcss.com/docs/padding
1196
- */
1197
- pt: [{
1198
- pt: scaleUnambiguousSpacing()
1199
- }],
1200
- /**
1201
- * Padding Right
1202
- * @see https://tailwindcss.com/docs/padding
1203
- */
1204
- pr: [{
1205
- pr: scaleUnambiguousSpacing()
1206
- }],
1207
- /**
1208
- * Padding Bottom
1209
- * @see https://tailwindcss.com/docs/padding
1210
- */
1211
- pb: [{
1212
- pb: scaleUnambiguousSpacing()
1213
- }],
1214
- /**
1215
- * Padding Left
1216
- * @see https://tailwindcss.com/docs/padding
1217
- */
1218
- pl: [{
1219
- pl: scaleUnambiguousSpacing()
1220
- }],
1221
- /**
1222
- * Margin
1223
- * @see https://tailwindcss.com/docs/margin
1224
- */
1225
- m: [{
1226
- m: scaleMargin()
1227
- }],
1228
- /**
1229
- * Margin X
1230
- * @see https://tailwindcss.com/docs/margin
1231
- */
1232
- mx: [{
1233
- mx: scaleMargin()
1234
- }],
1235
- /**
1236
- * Margin Y
1237
- * @see https://tailwindcss.com/docs/margin
1238
- */
1239
- my: [{
1240
- my: scaleMargin()
1241
- }],
1242
- /**
1243
- * Margin Start
1244
- * @see https://tailwindcss.com/docs/margin
1245
- */
1246
- ms: [{
1247
- ms: scaleMargin()
1248
- }],
1249
- /**
1250
- * Margin End
1251
- * @see https://tailwindcss.com/docs/margin
1252
- */
1253
- me: [{
1254
- me: scaleMargin()
1255
- }],
1256
- /**
1257
- * Margin Top
1258
- * @see https://tailwindcss.com/docs/margin
1259
- */
1260
- mt: [{
1261
- mt: scaleMargin()
1262
- }],
1263
- /**
1264
- * Margin Right
1265
- * @see https://tailwindcss.com/docs/margin
1266
- */
1267
- mr: [{
1268
- mr: scaleMargin()
1269
- }],
1270
- /**
1271
- * Margin Bottom
1272
- * @see https://tailwindcss.com/docs/margin
1273
- */
1274
- mb: [{
1275
- mb: scaleMargin()
1276
- }],
1277
- /**
1278
- * Margin Left
1279
- * @see https://tailwindcss.com/docs/margin
1280
- */
1281
- ml: [{
1282
- ml: scaleMargin()
1283
- }],
1284
- /**
1285
- * Space Between X
1286
- * @see https://tailwindcss.com/docs/margin#adding-space-between-children
1287
- */
1288
- 'space-x': [{
1289
- 'space-x': scaleUnambiguousSpacing()
1290
- }],
1291
- /**
1292
- * Space Between X Reverse
1293
- * @see https://tailwindcss.com/docs/margin#adding-space-between-children
1294
- */
1295
- 'space-x-reverse': ['space-x-reverse'],
1296
- /**
1297
- * Space Between Y
1298
- * @see https://tailwindcss.com/docs/margin#adding-space-between-children
1299
- */
1300
- 'space-y': [{
1301
- 'space-y': scaleUnambiguousSpacing()
1302
- }],
1303
- /**
1304
- * Space Between Y Reverse
1305
- * @see https://tailwindcss.com/docs/margin#adding-space-between-children
1306
- */
1307
- 'space-y-reverse': ['space-y-reverse'],
1308
- // --------------
1309
- // --- Sizing ---
1310
- // --------------
1311
- /**
1312
- * Size
1313
- * @see https://tailwindcss.com/docs/width#setting-both-width-and-height
1314
- */
1315
- size: [{
1316
- size: scaleSizing()
1317
- }],
1318
- /**
1319
- * Width
1320
- * @see https://tailwindcss.com/docs/width
1321
- */
1322
- w: [{
1323
- w: [themeContainer, 'screen', ...scaleSizing()]
1324
- }],
1325
- /**
1326
- * Min-Width
1327
- * @see https://tailwindcss.com/docs/min-width
1328
- */
1329
- 'min-w': [{
1330
- 'min-w': [themeContainer, 'screen', /** Deprecated. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
1331
- 'none', ...scaleSizing()]
1332
- }],
1333
- /**
1334
- * Max-Width
1335
- * @see https://tailwindcss.com/docs/max-width
1336
- */
1337
- 'max-w': [{
1338
- 'max-w': [themeContainer, 'screen', 'none', /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
1339
- 'prose', /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
1340
- {
1341
- screen: [themeBreakpoint]
1342
- }, ...scaleSizing()]
1343
- }],
1344
- /**
1345
- * Height
1346
- * @see https://tailwindcss.com/docs/height
1347
- */
1348
- h: [{
1349
- h: ['screen', 'lh', ...scaleSizing()]
1350
- }],
1351
- /**
1352
- * Min-Height
1353
- * @see https://tailwindcss.com/docs/min-height
1354
- */
1355
- 'min-h': [{
1356
- 'min-h': ['screen', 'lh', 'none', ...scaleSizing()]
1357
- }],
1358
- /**
1359
- * Max-Height
1360
- * @see https://tailwindcss.com/docs/max-height
1361
- */
1362
- 'max-h': [{
1363
- 'max-h': ['screen', 'lh', ...scaleSizing()]
1364
- }],
1365
- // ------------------
1366
- // --- Typography ---
1367
- // ------------------
1368
- /**
1369
- * Font Size
1370
- * @see https://tailwindcss.com/docs/font-size
1371
- */
1372
- 'font-size': [{
1373
- text: ['base', themeText, isArbitraryVariableLength, isArbitraryLength]
1374
- }],
1375
- /**
1376
- * Font Smoothing
1377
- * @see https://tailwindcss.com/docs/font-smoothing
1378
- */
1379
- 'font-smoothing': ['antialiased', 'subpixel-antialiased'],
1380
- /**
1381
- * Font Style
1382
- * @see https://tailwindcss.com/docs/font-style
1383
- */
1384
- 'font-style': ['italic', 'not-italic'],
1385
- /**
1386
- * Font Weight
1387
- * @see https://tailwindcss.com/docs/font-weight
1388
- */
1389
- 'font-weight': [{
1390
- font: [themeFontWeight, isArbitraryVariable, isArbitraryNumber]
1391
- }],
1392
- /**
1393
- * Font Stretch
1394
- * @see https://tailwindcss.com/docs/font-stretch
1395
- */
1396
- 'font-stretch': [{
1397
- 'font-stretch': ['ultra-condensed', 'extra-condensed', 'condensed', 'semi-condensed', 'normal', 'semi-expanded', 'expanded', 'extra-expanded', 'ultra-expanded', isPercent, isArbitraryValue]
1398
- }],
1399
- /**
1400
- * Font Family
1401
- * @see https://tailwindcss.com/docs/font-family
1402
- */
1403
- 'font-family': [{
1404
- font: [isArbitraryVariableFamilyName, isArbitraryValue, themeFont]
1405
- }],
1406
- /**
1407
- * Font Variant Numeric
1408
- * @see https://tailwindcss.com/docs/font-variant-numeric
1409
- */
1410
- 'fvn-normal': ['normal-nums'],
1411
- /**
1412
- * Font Variant Numeric
1413
- * @see https://tailwindcss.com/docs/font-variant-numeric
1414
- */
1415
- 'fvn-ordinal': ['ordinal'],
1416
- /**
1417
- * Font Variant Numeric
1418
- * @see https://tailwindcss.com/docs/font-variant-numeric
1419
- */
1420
- 'fvn-slashed-zero': ['slashed-zero'],
1421
- /**
1422
- * Font Variant Numeric
1423
- * @see https://tailwindcss.com/docs/font-variant-numeric
1424
- */
1425
- 'fvn-figure': ['lining-nums', 'oldstyle-nums'],
1426
- /**
1427
- * Font Variant Numeric
1428
- * @see https://tailwindcss.com/docs/font-variant-numeric
1429
- */
1430
- 'fvn-spacing': ['proportional-nums', 'tabular-nums'],
1431
- /**
1432
- * Font Variant Numeric
1433
- * @see https://tailwindcss.com/docs/font-variant-numeric
1434
- */
1435
- 'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
1436
- /**
1437
- * Letter Spacing
1438
- * @see https://tailwindcss.com/docs/letter-spacing
1439
- */
1440
- tracking: [{
1441
- tracking: [themeTracking, isArbitraryVariable, isArbitraryValue]
1442
- }],
1443
- /**
1444
- * Line Clamp
1445
- * @see https://tailwindcss.com/docs/line-clamp
1446
- */
1447
- 'line-clamp': [{
1448
- 'line-clamp': [isNumber, 'none', isArbitraryVariable, isArbitraryNumber]
1449
- }],
1450
- /**
1451
- * Line Height
1452
- * @see https://tailwindcss.com/docs/line-height
1453
- */
1454
- leading: [{
1455
- leading: [/** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
1456
- themeLeading, ...scaleUnambiguousSpacing()]
1457
- }],
1458
- /**
1459
- * List Style Image
1460
- * @see https://tailwindcss.com/docs/list-style-image
1461
- */
1462
- 'list-image': [{
1463
- 'list-image': ['none', isArbitraryVariable, isArbitraryValue]
1464
- }],
1465
- /**
1466
- * List Style Position
1467
- * @see https://tailwindcss.com/docs/list-style-position
1468
- */
1469
- 'list-style-position': [{
1470
- list: ['inside', 'outside']
1471
- }],
1472
- /**
1473
- * List Style Type
1474
- * @see https://tailwindcss.com/docs/list-style-type
1475
- */
1476
- 'list-style-type': [{
1477
- list: ['disc', 'decimal', 'none', isArbitraryVariable, isArbitraryValue]
1478
- }],
1479
- /**
1480
- * Text Alignment
1481
- * @see https://tailwindcss.com/docs/text-align
1482
- */
1483
- 'text-alignment': [{
1484
- text: ['left', 'center', 'right', 'justify', 'start', 'end']
1485
- }],
1486
- /**
1487
- * Placeholder Color
1488
- * @deprecated since Tailwind CSS v3.0.0
1489
- * @see https://v3.tailwindcss.com/docs/placeholder-color
1490
- */
1491
- 'placeholder-color': [{
1492
- placeholder: scaleColor()
1493
- }],
1494
- /**
1495
- * Text Color
1496
- * @see https://tailwindcss.com/docs/text-color
1497
- */
1498
- 'text-color': [{
1499
- text: scaleColor()
1500
- }],
1501
- /**
1502
- * Text Decoration
1503
- * @see https://tailwindcss.com/docs/text-decoration
1504
- */
1505
- 'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
1506
- /**
1507
- * Text Decoration Style
1508
- * @see https://tailwindcss.com/docs/text-decoration-style
1509
- */
1510
- 'text-decoration-style': [{
1511
- decoration: [...scaleLineStyle(), 'wavy']
1512
- }],
1513
- /**
1514
- * Text Decoration Thickness
1515
- * @see https://tailwindcss.com/docs/text-decoration-thickness
1516
- */
1517
- 'text-decoration-thickness': [{
1518
- decoration: [isNumber, 'from-font', 'auto', isArbitraryVariable, isArbitraryLength]
1519
- }],
1520
- /**
1521
- * Text Decoration Color
1522
- * @see https://tailwindcss.com/docs/text-decoration-color
1523
- */
1524
- 'text-decoration-color': [{
1525
- decoration: scaleColor()
1526
- }],
1527
- /**
1528
- * Text Underline Offset
1529
- * @see https://tailwindcss.com/docs/text-underline-offset
1530
- */
1531
- 'underline-offset': [{
1532
- 'underline-offset': [isNumber, 'auto', isArbitraryVariable, isArbitraryValue]
1533
- }],
1534
- /**
1535
- * Text Transform
1536
- * @see https://tailwindcss.com/docs/text-transform
1537
- */
1538
- 'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
1539
- /**
1540
- * Text Overflow
1541
- * @see https://tailwindcss.com/docs/text-overflow
1542
- */
1543
- 'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
1544
- /**
1545
- * Text Wrap
1546
- * @see https://tailwindcss.com/docs/text-wrap
1547
- */
1548
- 'text-wrap': [{
1549
- text: ['wrap', 'nowrap', 'balance', 'pretty']
1550
- }],
1551
- /**
1552
- * Text Indent
1553
- * @see https://tailwindcss.com/docs/text-indent
1554
- */
1555
- indent: [{
1556
- indent: scaleUnambiguousSpacing()
1557
- }],
1558
- /**
1559
- * Vertical Alignment
1560
- * @see https://tailwindcss.com/docs/vertical-align
1561
- */
1562
- 'vertical-align': [{
1563
- align: ['baseline', 'top', 'middle', 'bottom', 'text-top', 'text-bottom', 'sub', 'super', isArbitraryVariable, isArbitraryValue]
1564
- }],
1565
- /**
1566
- * Whitespace
1567
- * @see https://tailwindcss.com/docs/whitespace
1568
- */
1569
- whitespace: [{
1570
- whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces']
1571
- }],
1572
- /**
1573
- * Word Break
1574
- * @see https://tailwindcss.com/docs/word-break
1575
- */
1576
- break: [{
1577
- break: ['normal', 'words', 'all', 'keep']
1578
- }],
1579
- /**
1580
- * Overflow Wrap
1581
- * @see https://tailwindcss.com/docs/overflow-wrap
1582
- */
1583
- wrap: [{
1584
- wrap: ['break-word', 'anywhere', 'normal']
1585
- }],
1586
- /**
1587
- * Hyphens
1588
- * @see https://tailwindcss.com/docs/hyphens
1589
- */
1590
- hyphens: [{
1591
- hyphens: ['none', 'manual', 'auto']
1592
- }],
1593
- /**
1594
- * Content
1595
- * @see https://tailwindcss.com/docs/content
1596
- */
1597
- content: [{
1598
- content: ['none', isArbitraryVariable, isArbitraryValue]
1599
- }],
1600
- // -------------------
1601
- // --- Backgrounds ---
1602
- // -------------------
1603
- /**
1604
- * Background Attachment
1605
- * @see https://tailwindcss.com/docs/background-attachment
1606
- */
1607
- 'bg-attachment': [{
1608
- bg: ['fixed', 'local', 'scroll']
1609
- }],
1610
- /**
1611
- * Background Clip
1612
- * @see https://tailwindcss.com/docs/background-clip
1613
- */
1614
- 'bg-clip': [{
1615
- 'bg-clip': ['border', 'padding', 'content', 'text']
1616
- }],
1617
- /**
1618
- * Background Origin
1619
- * @see https://tailwindcss.com/docs/background-origin
1620
- */
1621
- 'bg-origin': [{
1622
- 'bg-origin': ['border', 'padding', 'content']
1623
- }],
1624
- /**
1625
- * Background Position
1626
- * @see https://tailwindcss.com/docs/background-position
1627
- */
1628
- 'bg-position': [{
1629
- bg: scaleBgPosition()
1630
- }],
1631
- /**
1632
- * Background Repeat
1633
- * @see https://tailwindcss.com/docs/background-repeat
1634
- */
1635
- 'bg-repeat': [{
1636
- bg: scaleBgRepeat()
1637
- }],
1638
- /**
1639
- * Background Size
1640
- * @see https://tailwindcss.com/docs/background-size
1641
- */
1642
- 'bg-size': [{
1643
- bg: scaleBgSize()
1644
- }],
1645
- /**
1646
- * Background Image
1647
- * @see https://tailwindcss.com/docs/background-image
1648
- */
1649
- 'bg-image': [{
1650
- bg: ['none', {
1651
- linear: [{
1652
- to: ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
1653
- }, isInteger, isArbitraryVariable, isArbitraryValue],
1654
- radial: ['', isArbitraryVariable, isArbitraryValue],
1655
- conic: [isInteger, isArbitraryVariable, isArbitraryValue]
1656
- }, isArbitraryVariableImage, isArbitraryImage]
1657
- }],
1658
- /**
1659
- * Background Color
1660
- * @see https://tailwindcss.com/docs/background-color
1661
- */
1662
- 'bg-color': [{
1663
- bg: scaleColor()
1664
- }],
1665
- /**
1666
- * Gradient Color Stops From Position
1667
- * @see https://tailwindcss.com/docs/gradient-color-stops
1668
- */
1669
- 'gradient-from-pos': [{
1670
- from: scaleGradientStopPosition()
1671
- }],
1672
- /**
1673
- * Gradient Color Stops Via Position
1674
- * @see https://tailwindcss.com/docs/gradient-color-stops
1675
- */
1676
- 'gradient-via-pos': [{
1677
- via: scaleGradientStopPosition()
1678
- }],
1679
- /**
1680
- * Gradient Color Stops To Position
1681
- * @see https://tailwindcss.com/docs/gradient-color-stops
1682
- */
1683
- 'gradient-to-pos': [{
1684
- to: scaleGradientStopPosition()
1685
- }],
1686
- /**
1687
- * Gradient Color Stops From
1688
- * @see https://tailwindcss.com/docs/gradient-color-stops
1689
- */
1690
- 'gradient-from': [{
1691
- from: scaleColor()
1692
- }],
1693
- /**
1694
- * Gradient Color Stops Via
1695
- * @see https://tailwindcss.com/docs/gradient-color-stops
1696
- */
1697
- 'gradient-via': [{
1698
- via: scaleColor()
1699
- }],
1700
- /**
1701
- * Gradient Color Stops To
1702
- * @see https://tailwindcss.com/docs/gradient-color-stops
1703
- */
1704
- 'gradient-to': [{
1705
- to: scaleColor()
1706
- }],
1707
- // ---------------
1708
- // --- Borders ---
1709
- // ---------------
1710
- /**
1711
- * Border Radius
1712
- * @see https://tailwindcss.com/docs/border-radius
1713
- */
1714
- rounded: [{
1715
- rounded: scaleRadius()
1716
- }],
1717
- /**
1718
- * Border Radius Start
1719
- * @see https://tailwindcss.com/docs/border-radius
1720
- */
1721
- 'rounded-s': [{
1722
- 'rounded-s': scaleRadius()
1723
- }],
1724
- /**
1725
- * Border Radius End
1726
- * @see https://tailwindcss.com/docs/border-radius
1727
- */
1728
- 'rounded-e': [{
1729
- 'rounded-e': scaleRadius()
1730
- }],
1731
- /**
1732
- * Border Radius Top
1733
- * @see https://tailwindcss.com/docs/border-radius
1734
- */
1735
- 'rounded-t': [{
1736
- 'rounded-t': scaleRadius()
1737
- }],
1738
- /**
1739
- * Border Radius Right
1740
- * @see https://tailwindcss.com/docs/border-radius
1741
- */
1742
- 'rounded-r': [{
1743
- 'rounded-r': scaleRadius()
1744
- }],
1745
- /**
1746
- * Border Radius Bottom
1747
- * @see https://tailwindcss.com/docs/border-radius
1748
- */
1749
- 'rounded-b': [{
1750
- 'rounded-b': scaleRadius()
1751
- }],
1752
- /**
1753
- * Border Radius Left
1754
- * @see https://tailwindcss.com/docs/border-radius
1755
- */
1756
- 'rounded-l': [{
1757
- 'rounded-l': scaleRadius()
1758
- }],
1759
- /**
1760
- * Border Radius Start Start
1761
- * @see https://tailwindcss.com/docs/border-radius
1762
- */
1763
- 'rounded-ss': [{
1764
- 'rounded-ss': scaleRadius()
1765
- }],
1766
- /**
1767
- * Border Radius Start End
1768
- * @see https://tailwindcss.com/docs/border-radius
1769
- */
1770
- 'rounded-se': [{
1771
- 'rounded-se': scaleRadius()
1772
- }],
1773
- /**
1774
- * Border Radius End End
1775
- * @see https://tailwindcss.com/docs/border-radius
1776
- */
1777
- 'rounded-ee': [{
1778
- 'rounded-ee': scaleRadius()
1779
- }],
1780
- /**
1781
- * Border Radius End Start
1782
- * @see https://tailwindcss.com/docs/border-radius
1783
- */
1784
- 'rounded-es': [{
1785
- 'rounded-es': scaleRadius()
1786
- }],
1787
- /**
1788
- * Border Radius Top Left
1789
- * @see https://tailwindcss.com/docs/border-radius
1790
- */
1791
- 'rounded-tl': [{
1792
- 'rounded-tl': scaleRadius()
1793
- }],
1794
- /**
1795
- * Border Radius Top Right
1796
- * @see https://tailwindcss.com/docs/border-radius
1797
- */
1798
- 'rounded-tr': [{
1799
- 'rounded-tr': scaleRadius()
1800
- }],
1801
- /**
1802
- * Border Radius Bottom Right
1803
- * @see https://tailwindcss.com/docs/border-radius
1804
- */
1805
- 'rounded-br': [{
1806
- 'rounded-br': scaleRadius()
1807
- }],
1808
- /**
1809
- * Border Radius Bottom Left
1810
- * @see https://tailwindcss.com/docs/border-radius
1811
- */
1812
- 'rounded-bl': [{
1813
- 'rounded-bl': scaleRadius()
1814
- }],
1815
- /**
1816
- * Border Width
1817
- * @see https://tailwindcss.com/docs/border-width
1818
- */
1819
- 'border-w': [{
1820
- border: scaleBorderWidth()
1821
- }],
1822
- /**
1823
- * Border Width X
1824
- * @see https://tailwindcss.com/docs/border-width
1825
- */
1826
- 'border-w-x': [{
1827
- 'border-x': scaleBorderWidth()
1828
- }],
1829
- /**
1830
- * Border Width Y
1831
- * @see https://tailwindcss.com/docs/border-width
1832
- */
1833
- 'border-w-y': [{
1834
- 'border-y': scaleBorderWidth()
1835
- }],
1836
- /**
1837
- * Border Width Start
1838
- * @see https://tailwindcss.com/docs/border-width
1839
- */
1840
- 'border-w-s': [{
1841
- 'border-s': scaleBorderWidth()
1842
- }],
1843
- /**
1844
- * Border Width End
1845
- * @see https://tailwindcss.com/docs/border-width
1846
- */
1847
- 'border-w-e': [{
1848
- 'border-e': scaleBorderWidth()
1849
- }],
1850
- /**
1851
- * Border Width Top
1852
- * @see https://tailwindcss.com/docs/border-width
1853
- */
1854
- 'border-w-t': [{
1855
- 'border-t': scaleBorderWidth()
1856
- }],
1857
- /**
1858
- * Border Width Right
1859
- * @see https://tailwindcss.com/docs/border-width
1860
- */
1861
- 'border-w-r': [{
1862
- 'border-r': scaleBorderWidth()
1863
- }],
1864
- /**
1865
- * Border Width Bottom
1866
- * @see https://tailwindcss.com/docs/border-width
1867
- */
1868
- 'border-w-b': [{
1869
- 'border-b': scaleBorderWidth()
1870
- }],
1871
- /**
1872
- * Border Width Left
1873
- * @see https://tailwindcss.com/docs/border-width
1874
- */
1875
- 'border-w-l': [{
1876
- 'border-l': scaleBorderWidth()
1877
- }],
1878
- /**
1879
- * Divide Width X
1880
- * @see https://tailwindcss.com/docs/border-width#between-children
1881
- */
1882
- 'divide-x': [{
1883
- 'divide-x': scaleBorderWidth()
1884
- }],
1885
- /**
1886
- * Divide Width X Reverse
1887
- * @see https://tailwindcss.com/docs/border-width#between-children
1888
- */
1889
- 'divide-x-reverse': ['divide-x-reverse'],
1890
- /**
1891
- * Divide Width Y
1892
- * @see https://tailwindcss.com/docs/border-width#between-children
1893
- */
1894
- 'divide-y': [{
1895
- 'divide-y': scaleBorderWidth()
1896
- }],
1897
- /**
1898
- * Divide Width Y Reverse
1899
- * @see https://tailwindcss.com/docs/border-width#between-children
1900
- */
1901
- 'divide-y-reverse': ['divide-y-reverse'],
1902
- /**
1903
- * Border Style
1904
- * @see https://tailwindcss.com/docs/border-style
1905
- */
1906
- 'border-style': [{
1907
- border: [...scaleLineStyle(), 'hidden', 'none']
1908
- }],
1909
- /**
1910
- * Divide Style
1911
- * @see https://tailwindcss.com/docs/border-style#setting-the-divider-style
1912
- */
1913
- 'divide-style': [{
1914
- divide: [...scaleLineStyle(), 'hidden', 'none']
1915
- }],
1916
- /**
1917
- * Border Color
1918
- * @see https://tailwindcss.com/docs/border-color
1919
- */
1920
- 'border-color': [{
1921
- border: scaleColor()
1922
- }],
1923
- /**
1924
- * Border Color X
1925
- * @see https://tailwindcss.com/docs/border-color
1926
- */
1927
- 'border-color-x': [{
1928
- 'border-x': scaleColor()
1929
- }],
1930
- /**
1931
- * Border Color Y
1932
- * @see https://tailwindcss.com/docs/border-color
1933
- */
1934
- 'border-color-y': [{
1935
- 'border-y': scaleColor()
1936
- }],
1937
- /**
1938
- * Border Color S
1939
- * @see https://tailwindcss.com/docs/border-color
1940
- */
1941
- 'border-color-s': [{
1942
- 'border-s': scaleColor()
1943
- }],
1944
- /**
1945
- * Border Color E
1946
- * @see https://tailwindcss.com/docs/border-color
1947
- */
1948
- 'border-color-e': [{
1949
- 'border-e': scaleColor()
1950
- }],
1951
- /**
1952
- * Border Color Top
1953
- * @see https://tailwindcss.com/docs/border-color
1954
- */
1955
- 'border-color-t': [{
1956
- 'border-t': scaleColor()
1957
- }],
1958
- /**
1959
- * Border Color Right
1960
- * @see https://tailwindcss.com/docs/border-color
1961
- */
1962
- 'border-color-r': [{
1963
- 'border-r': scaleColor()
1964
- }],
1965
- /**
1966
- * Border Color Bottom
1967
- * @see https://tailwindcss.com/docs/border-color
1968
- */
1969
- 'border-color-b': [{
1970
- 'border-b': scaleColor()
1971
- }],
1972
- /**
1973
- * Border Color Left
1974
- * @see https://tailwindcss.com/docs/border-color
1975
- */
1976
- 'border-color-l': [{
1977
- 'border-l': scaleColor()
1978
- }],
1979
- /**
1980
- * Divide Color
1981
- * @see https://tailwindcss.com/docs/divide-color
1982
- */
1983
- 'divide-color': [{
1984
- divide: scaleColor()
1985
- }],
1986
- /**
1987
- * Outline Style
1988
- * @see https://tailwindcss.com/docs/outline-style
1989
- */
1990
- 'outline-style': [{
1991
- outline: [...scaleLineStyle(), 'none', 'hidden']
1992
- }],
1993
- /**
1994
- * Outline Offset
1995
- * @see https://tailwindcss.com/docs/outline-offset
1996
- */
1997
- 'outline-offset': [{
1998
- 'outline-offset': [isNumber, isArbitraryVariable, isArbitraryValue]
1999
- }],
2000
- /**
2001
- * Outline Width
2002
- * @see https://tailwindcss.com/docs/outline-width
2003
- */
2004
- 'outline-w': [{
2005
- outline: ['', isNumber, isArbitraryVariableLength, isArbitraryLength]
2006
- }],
2007
- /**
2008
- * Outline Color
2009
- * @see https://tailwindcss.com/docs/outline-color
2010
- */
2011
- 'outline-color': [{
2012
- outline: scaleColor()
2013
- }],
2014
- // ---------------
2015
- // --- Effects ---
2016
- // ---------------
2017
- /**
2018
- * Box Shadow
2019
- * @see https://tailwindcss.com/docs/box-shadow
2020
- */
2021
- shadow: [{
2022
- shadow: [
2023
- // Deprecated since Tailwind CSS v4.0.0
2024
- '', 'none', themeShadow, isArbitraryVariableShadow, isArbitraryShadow]
2025
- }],
2026
- /**
2027
- * Box Shadow Color
2028
- * @see https://tailwindcss.com/docs/box-shadow#setting-the-shadow-color
2029
- */
2030
- 'shadow-color': [{
2031
- shadow: scaleColor()
2032
- }],
2033
- /**
2034
- * Inset Box Shadow
2035
- * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-shadow
2036
- */
2037
- 'inset-shadow': [{
2038
- 'inset-shadow': ['none', themeInsetShadow, isArbitraryVariableShadow, isArbitraryShadow]
2039
- }],
2040
- /**
2041
- * Inset Box Shadow Color
2042
- * @see https://tailwindcss.com/docs/box-shadow#setting-the-inset-shadow-color
2043
- */
2044
- 'inset-shadow-color': [{
2045
- 'inset-shadow': scaleColor()
2046
- }],
2047
- /**
2048
- * Ring Width
2049
- * @see https://tailwindcss.com/docs/box-shadow#adding-a-ring
2050
- */
2051
- 'ring-w': [{
2052
- ring: scaleBorderWidth()
2053
- }],
2054
- /**
2055
- * Ring Width Inset
2056
- * @see https://v3.tailwindcss.com/docs/ring-width#inset-rings
2057
- * @deprecated since Tailwind CSS v4.0.0
2058
- * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
2059
- */
2060
- 'ring-w-inset': ['ring-inset'],
2061
- /**
2062
- * Ring Color
2063
- * @see https://tailwindcss.com/docs/box-shadow#setting-the-ring-color
2064
- */
2065
- 'ring-color': [{
2066
- ring: scaleColor()
2067
- }],
2068
- /**
2069
- * Ring Offset Width
2070
- * @see https://v3.tailwindcss.com/docs/ring-offset-width
2071
- * @deprecated since Tailwind CSS v4.0.0
2072
- * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
2073
- */
2074
- 'ring-offset-w': [{
2075
- 'ring-offset': [isNumber, isArbitraryLength]
2076
- }],
2077
- /**
2078
- * Ring Offset Color
2079
- * @see https://v3.tailwindcss.com/docs/ring-offset-color
2080
- * @deprecated since Tailwind CSS v4.0.0
2081
- * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
2082
- */
2083
- 'ring-offset-color': [{
2084
- 'ring-offset': scaleColor()
2085
- }],
2086
- /**
2087
- * Inset Ring Width
2088
- * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-ring
2089
- */
2090
- 'inset-ring-w': [{
2091
- 'inset-ring': scaleBorderWidth()
2092
- }],
2093
- /**
2094
- * Inset Ring Color
2095
- * @see https://tailwindcss.com/docs/box-shadow#setting-the-inset-ring-color
2096
- */
2097
- 'inset-ring-color': [{
2098
- 'inset-ring': scaleColor()
2099
- }],
2100
- /**
2101
- * Text Shadow
2102
- * @see https://tailwindcss.com/docs/text-shadow
2103
- */
2104
- 'text-shadow': [{
2105
- 'text-shadow': ['none', themeTextShadow, isArbitraryVariableShadow, isArbitraryShadow]
2106
- }],
2107
- /**
2108
- * Text Shadow Color
2109
- * @see https://tailwindcss.com/docs/text-shadow#setting-the-shadow-color
2110
- */
2111
- 'text-shadow-color': [{
2112
- 'text-shadow': scaleColor()
2113
- }],
2114
- /**
2115
- * Opacity
2116
- * @see https://tailwindcss.com/docs/opacity
2117
- */
2118
- opacity: [{
2119
- opacity: [isNumber, isArbitraryVariable, isArbitraryValue]
2120
- }],
2121
- /**
2122
- * Mix Blend Mode
2123
- * @see https://tailwindcss.com/docs/mix-blend-mode
2124
- */
2125
- 'mix-blend': [{
2126
- 'mix-blend': [...scaleBlendMode(), 'plus-darker', 'plus-lighter']
2127
- }],
2128
- /**
2129
- * Background Blend Mode
2130
- * @see https://tailwindcss.com/docs/background-blend-mode
2131
- */
2132
- 'bg-blend': [{
2133
- 'bg-blend': scaleBlendMode()
2134
- }],
2135
- /**
2136
- * Mask Clip
2137
- * @see https://tailwindcss.com/docs/mask-clip
2138
- */
2139
- 'mask-clip': [{
2140
- 'mask-clip': ['border', 'padding', 'content', 'fill', 'stroke', 'view']
2141
- }, 'mask-no-clip'],
2142
- /**
2143
- * Mask Composite
2144
- * @see https://tailwindcss.com/docs/mask-composite
2145
- */
2146
- 'mask-composite': [{
2147
- mask: ['add', 'subtract', 'intersect', 'exclude']
2148
- }],
2149
- /**
2150
- * Mask Image
2151
- * @see https://tailwindcss.com/docs/mask-image
2152
- */
2153
- 'mask-image-linear-pos': [{
2154
- 'mask-linear': [isNumber]
2155
- }],
2156
- 'mask-image-linear-from-pos': [{
2157
- 'mask-linear-from': scaleMaskImagePosition()
2158
- }],
2159
- 'mask-image-linear-to-pos': [{
2160
- 'mask-linear-to': scaleMaskImagePosition()
2161
- }],
2162
- 'mask-image-linear-from-color': [{
2163
- 'mask-linear-from': scaleColor()
2164
- }],
2165
- 'mask-image-linear-to-color': [{
2166
- 'mask-linear-to': scaleColor()
2167
- }],
2168
- 'mask-image-t-from-pos': [{
2169
- 'mask-t-from': scaleMaskImagePosition()
2170
- }],
2171
- 'mask-image-t-to-pos': [{
2172
- 'mask-t-to': scaleMaskImagePosition()
2173
- }],
2174
- 'mask-image-t-from-color': [{
2175
- 'mask-t-from': scaleColor()
2176
- }],
2177
- 'mask-image-t-to-color': [{
2178
- 'mask-t-to': scaleColor()
2179
- }],
2180
- 'mask-image-r-from-pos': [{
2181
- 'mask-r-from': scaleMaskImagePosition()
2182
- }],
2183
- 'mask-image-r-to-pos': [{
2184
- 'mask-r-to': scaleMaskImagePosition()
2185
- }],
2186
- 'mask-image-r-from-color': [{
2187
- 'mask-r-from': scaleColor()
2188
- }],
2189
- 'mask-image-r-to-color': [{
2190
- 'mask-r-to': scaleColor()
2191
- }],
2192
- 'mask-image-b-from-pos': [{
2193
- 'mask-b-from': scaleMaskImagePosition()
2194
- }],
2195
- 'mask-image-b-to-pos': [{
2196
- 'mask-b-to': scaleMaskImagePosition()
2197
- }],
2198
- 'mask-image-b-from-color': [{
2199
- 'mask-b-from': scaleColor()
2200
- }],
2201
- 'mask-image-b-to-color': [{
2202
- 'mask-b-to': scaleColor()
2203
- }],
2204
- 'mask-image-l-from-pos': [{
2205
- 'mask-l-from': scaleMaskImagePosition()
2206
- }],
2207
- 'mask-image-l-to-pos': [{
2208
- 'mask-l-to': scaleMaskImagePosition()
2209
- }],
2210
- 'mask-image-l-from-color': [{
2211
- 'mask-l-from': scaleColor()
2212
- }],
2213
- 'mask-image-l-to-color': [{
2214
- 'mask-l-to': scaleColor()
2215
- }],
2216
- 'mask-image-x-from-pos': [{
2217
- 'mask-x-from': scaleMaskImagePosition()
2218
- }],
2219
- 'mask-image-x-to-pos': [{
2220
- 'mask-x-to': scaleMaskImagePosition()
2221
- }],
2222
- 'mask-image-x-from-color': [{
2223
- 'mask-x-from': scaleColor()
2224
- }],
2225
- 'mask-image-x-to-color': [{
2226
- 'mask-x-to': scaleColor()
2227
- }],
2228
- 'mask-image-y-from-pos': [{
2229
- 'mask-y-from': scaleMaskImagePosition()
2230
- }],
2231
- 'mask-image-y-to-pos': [{
2232
- 'mask-y-to': scaleMaskImagePosition()
2233
- }],
2234
- 'mask-image-y-from-color': [{
2235
- 'mask-y-from': scaleColor()
2236
- }],
2237
- 'mask-image-y-to-color': [{
2238
- 'mask-y-to': scaleColor()
2239
- }],
2240
- 'mask-image-radial': [{
2241
- 'mask-radial': [isArbitraryVariable, isArbitraryValue]
2242
- }],
2243
- 'mask-image-radial-from-pos': [{
2244
- 'mask-radial-from': scaleMaskImagePosition()
2245
- }],
2246
- 'mask-image-radial-to-pos': [{
2247
- 'mask-radial-to': scaleMaskImagePosition()
2248
- }],
2249
- 'mask-image-radial-from-color': [{
2250
- 'mask-radial-from': scaleColor()
2251
- }],
2252
- 'mask-image-radial-to-color': [{
2253
- 'mask-radial-to': scaleColor()
2254
- }],
2255
- 'mask-image-radial-shape': [{
2256
- 'mask-radial': ['circle', 'ellipse']
2257
- }],
2258
- 'mask-image-radial-size': [{
2259
- 'mask-radial': [{
2260
- closest: ['side', 'corner'],
2261
- farthest: ['side', 'corner']
2262
- }]
2263
- }],
2264
- 'mask-image-radial-pos': [{
2265
- 'mask-radial-at': scalePosition()
2266
- }],
2267
- 'mask-image-conic-pos': [{
2268
- 'mask-conic': [isNumber]
2269
- }],
2270
- 'mask-image-conic-from-pos': [{
2271
- 'mask-conic-from': scaleMaskImagePosition()
2272
- }],
2273
- 'mask-image-conic-to-pos': [{
2274
- 'mask-conic-to': scaleMaskImagePosition()
2275
- }],
2276
- 'mask-image-conic-from-color': [{
2277
- 'mask-conic-from': scaleColor()
2278
- }],
2279
- 'mask-image-conic-to-color': [{
2280
- 'mask-conic-to': scaleColor()
2281
- }],
2282
- /**
2283
- * Mask Mode
2284
- * @see https://tailwindcss.com/docs/mask-mode
2285
- */
2286
- 'mask-mode': [{
2287
- mask: ['alpha', 'luminance', 'match']
2288
- }],
2289
- /**
2290
- * Mask Origin
2291
- * @see https://tailwindcss.com/docs/mask-origin
2292
- */
2293
- 'mask-origin': [{
2294
- 'mask-origin': ['border', 'padding', 'content', 'fill', 'stroke', 'view']
2295
- }],
2296
- /**
2297
- * Mask Position
2298
- * @see https://tailwindcss.com/docs/mask-position
2299
- */
2300
- 'mask-position': [{
2301
- mask: scaleBgPosition()
2302
- }],
2303
- /**
2304
- * Mask Repeat
2305
- * @see https://tailwindcss.com/docs/mask-repeat
2306
- */
2307
- 'mask-repeat': [{
2308
- mask: scaleBgRepeat()
2309
- }],
2310
- /**
2311
- * Mask Size
2312
- * @see https://tailwindcss.com/docs/mask-size
2313
- */
2314
- 'mask-size': [{
2315
- mask: scaleBgSize()
2316
- }],
2317
- /**
2318
- * Mask Type
2319
- * @see https://tailwindcss.com/docs/mask-type
2320
- */
2321
- 'mask-type': [{
2322
- 'mask-type': ['alpha', 'luminance']
2323
- }],
2324
- /**
2325
- * Mask Image
2326
- * @see https://tailwindcss.com/docs/mask-image
2327
- */
2328
- 'mask-image': [{
2329
- mask: ['none', isArbitraryVariable, isArbitraryValue]
2330
- }],
2331
- // ---------------
2332
- // --- Filters ---
2333
- // ---------------
2334
- /**
2335
- * Filter
2336
- * @see https://tailwindcss.com/docs/filter
2337
- */
2338
- filter: [{
2339
- filter: [
2340
- // Deprecated since Tailwind CSS v3.0.0
2341
- '', 'none', isArbitraryVariable, isArbitraryValue]
2342
- }],
2343
- /**
2344
- * Blur
2345
- * @see https://tailwindcss.com/docs/blur
2346
- */
2347
- blur: [{
2348
- blur: scaleBlur()
2349
- }],
2350
- /**
2351
- * Brightness
2352
- * @see https://tailwindcss.com/docs/brightness
2353
- */
2354
- brightness: [{
2355
- brightness: [isNumber, isArbitraryVariable, isArbitraryValue]
2356
- }],
2357
- /**
2358
- * Contrast
2359
- * @see https://tailwindcss.com/docs/contrast
2360
- */
2361
- contrast: [{
2362
- contrast: [isNumber, isArbitraryVariable, isArbitraryValue]
2363
- }],
2364
- /**
2365
- * Drop Shadow
2366
- * @see https://tailwindcss.com/docs/drop-shadow
2367
- */
2368
- 'drop-shadow': [{
2369
- 'drop-shadow': [
2370
- // Deprecated since Tailwind CSS v4.0.0
2371
- '', 'none', themeDropShadow, isArbitraryVariableShadow, isArbitraryShadow]
2372
- }],
2373
- /**
2374
- * Drop Shadow Color
2375
- * @see https://tailwindcss.com/docs/filter-drop-shadow#setting-the-shadow-color
2376
- */
2377
- 'drop-shadow-color': [{
2378
- 'drop-shadow': scaleColor()
2379
- }],
2380
- /**
2381
- * Grayscale
2382
- * @see https://tailwindcss.com/docs/grayscale
2383
- */
2384
- grayscale: [{
2385
- grayscale: ['', isNumber, isArbitraryVariable, isArbitraryValue]
2386
- }],
2387
- /**
2388
- * Hue Rotate
2389
- * @see https://tailwindcss.com/docs/hue-rotate
2390
- */
2391
- 'hue-rotate': [{
2392
- 'hue-rotate': [isNumber, isArbitraryVariable, isArbitraryValue]
2393
- }],
2394
- /**
2395
- * Invert
2396
- * @see https://tailwindcss.com/docs/invert
2397
- */
2398
- invert: [{
2399
- invert: ['', isNumber, isArbitraryVariable, isArbitraryValue]
2400
- }],
2401
- /**
2402
- * Saturate
2403
- * @see https://tailwindcss.com/docs/saturate
2404
- */
2405
- saturate: [{
2406
- saturate: [isNumber, isArbitraryVariable, isArbitraryValue]
2407
- }],
2408
- /**
2409
- * Sepia
2410
- * @see https://tailwindcss.com/docs/sepia
2411
- */
2412
- sepia: [{
2413
- sepia: ['', isNumber, isArbitraryVariable, isArbitraryValue]
2414
- }],
2415
- /**
2416
- * Backdrop Filter
2417
- * @see https://tailwindcss.com/docs/backdrop-filter
2418
- */
2419
- 'backdrop-filter': [{
2420
- 'backdrop-filter': [
2421
- // Deprecated since Tailwind CSS v3.0.0
2422
- '', 'none', isArbitraryVariable, isArbitraryValue]
2423
- }],
2424
- /**
2425
- * Backdrop Blur
2426
- * @see https://tailwindcss.com/docs/backdrop-blur
2427
- */
2428
- 'backdrop-blur': [{
2429
- 'backdrop-blur': scaleBlur()
2430
- }],
2431
- /**
2432
- * Backdrop Brightness
2433
- * @see https://tailwindcss.com/docs/backdrop-brightness
2434
- */
2435
- 'backdrop-brightness': [{
2436
- 'backdrop-brightness': [isNumber, isArbitraryVariable, isArbitraryValue]
2437
- }],
2438
- /**
2439
- * Backdrop Contrast
2440
- * @see https://tailwindcss.com/docs/backdrop-contrast
2441
- */
2442
- 'backdrop-contrast': [{
2443
- 'backdrop-contrast': [isNumber, isArbitraryVariable, isArbitraryValue]
2444
- }],
2445
- /**
2446
- * Backdrop Grayscale
2447
- * @see https://tailwindcss.com/docs/backdrop-grayscale
2448
- */
2449
- 'backdrop-grayscale': [{
2450
- 'backdrop-grayscale': ['', isNumber, isArbitraryVariable, isArbitraryValue]
2451
- }],
2452
- /**
2453
- * Backdrop Hue Rotate
2454
- * @see https://tailwindcss.com/docs/backdrop-hue-rotate
2455
- */
2456
- 'backdrop-hue-rotate': [{
2457
- 'backdrop-hue-rotate': [isNumber, isArbitraryVariable, isArbitraryValue]
2458
- }],
2459
- /**
2460
- * Backdrop Invert
2461
- * @see https://tailwindcss.com/docs/backdrop-invert
2462
- */
2463
- 'backdrop-invert': [{
2464
- 'backdrop-invert': ['', isNumber, isArbitraryVariable, isArbitraryValue]
2465
- }],
2466
- /**
2467
- * Backdrop Opacity
2468
- * @see https://tailwindcss.com/docs/backdrop-opacity
2469
- */
2470
- 'backdrop-opacity': [{
2471
- 'backdrop-opacity': [isNumber, isArbitraryVariable, isArbitraryValue]
2472
- }],
2473
- /**
2474
- * Backdrop Saturate
2475
- * @see https://tailwindcss.com/docs/backdrop-saturate
2476
- */
2477
- 'backdrop-saturate': [{
2478
- 'backdrop-saturate': [isNumber, isArbitraryVariable, isArbitraryValue]
2479
- }],
2480
- /**
2481
- * Backdrop Sepia
2482
- * @see https://tailwindcss.com/docs/backdrop-sepia
2483
- */
2484
- 'backdrop-sepia': [{
2485
- 'backdrop-sepia': ['', isNumber, isArbitraryVariable, isArbitraryValue]
2486
- }],
2487
- // --------------
2488
- // --- Tables ---
2489
- // --------------
2490
- /**
2491
- * Border Collapse
2492
- * @see https://tailwindcss.com/docs/border-collapse
2493
- */
2494
- 'border-collapse': [{
2495
- border: ['collapse', 'separate']
2496
- }],
2497
- /**
2498
- * Border Spacing
2499
- * @see https://tailwindcss.com/docs/border-spacing
2500
- */
2501
- 'border-spacing': [{
2502
- 'border-spacing': scaleUnambiguousSpacing()
2503
- }],
2504
- /**
2505
- * Border Spacing X
2506
- * @see https://tailwindcss.com/docs/border-spacing
2507
- */
2508
- 'border-spacing-x': [{
2509
- 'border-spacing-x': scaleUnambiguousSpacing()
2510
- }],
2511
- /**
2512
- * Border Spacing Y
2513
- * @see https://tailwindcss.com/docs/border-spacing
2514
- */
2515
- 'border-spacing-y': [{
2516
- 'border-spacing-y': scaleUnambiguousSpacing()
2517
- }],
2518
- /**
2519
- * Table Layout
2520
- * @see https://tailwindcss.com/docs/table-layout
2521
- */
2522
- 'table-layout': [{
2523
- table: ['auto', 'fixed']
2524
- }],
2525
- /**
2526
- * Caption Side
2527
- * @see https://tailwindcss.com/docs/caption-side
2528
- */
2529
- caption: [{
2530
- caption: ['top', 'bottom']
2531
- }],
2532
- // ---------------------------------
2533
- // --- Transitions and Animation ---
2534
- // ---------------------------------
2535
- /**
2536
- * Transition Property
2537
- * @see https://tailwindcss.com/docs/transition-property
2538
- */
2539
- transition: [{
2540
- transition: ['', 'all', 'colors', 'opacity', 'shadow', 'transform', 'none', isArbitraryVariable, isArbitraryValue]
2541
- }],
2542
- /**
2543
- * Transition Behavior
2544
- * @see https://tailwindcss.com/docs/transition-behavior
2545
- */
2546
- 'transition-behavior': [{
2547
- transition: ['normal', 'discrete']
2548
- }],
2549
- /**
2550
- * Transition Duration
2551
- * @see https://tailwindcss.com/docs/transition-duration
2552
- */
2553
- duration: [{
2554
- duration: [isNumber, 'initial', isArbitraryVariable, isArbitraryValue]
2555
- }],
2556
- /**
2557
- * Transition Timing Function
2558
- * @see https://tailwindcss.com/docs/transition-timing-function
2559
- */
2560
- ease: [{
2561
- ease: ['linear', 'initial', themeEase, isArbitraryVariable, isArbitraryValue]
2562
- }],
2563
- /**
2564
- * Transition Delay
2565
- * @see https://tailwindcss.com/docs/transition-delay
2566
- */
2567
- delay: [{
2568
- delay: [isNumber, isArbitraryVariable, isArbitraryValue]
2569
- }],
2570
- /**
2571
- * Animation
2572
- * @see https://tailwindcss.com/docs/animation
2573
- */
2574
- animate: [{
2575
- animate: ['none', themeAnimate, isArbitraryVariable, isArbitraryValue]
2576
- }],
2577
- // ------------------
2578
- // --- Transforms ---
2579
- // ------------------
2580
- /**
2581
- * Backface Visibility
2582
- * @see https://tailwindcss.com/docs/backface-visibility
2583
- */
2584
- backface: [{
2585
- backface: ['hidden', 'visible']
2586
- }],
2587
- /**
2588
- * Perspective
2589
- * @see https://tailwindcss.com/docs/perspective
2590
- */
2591
- perspective: [{
2592
- perspective: [themePerspective, isArbitraryVariable, isArbitraryValue]
2593
- }],
2594
- /**
2595
- * Perspective Origin
2596
- * @see https://tailwindcss.com/docs/perspective-origin
2597
- */
2598
- 'perspective-origin': [{
2599
- 'perspective-origin': scalePositionWithArbitrary()
2600
- }],
2601
- /**
2602
- * Rotate
2603
- * @see https://tailwindcss.com/docs/rotate
2604
- */
2605
- rotate: [{
2606
- rotate: scaleRotate()
2607
- }],
2608
- /**
2609
- * Rotate X
2610
- * @see https://tailwindcss.com/docs/rotate
2611
- */
2612
- 'rotate-x': [{
2613
- 'rotate-x': scaleRotate()
2614
- }],
2615
- /**
2616
- * Rotate Y
2617
- * @see https://tailwindcss.com/docs/rotate
2618
- */
2619
- 'rotate-y': [{
2620
- 'rotate-y': scaleRotate()
2621
- }],
2622
- /**
2623
- * Rotate Z
2624
- * @see https://tailwindcss.com/docs/rotate
2625
- */
2626
- 'rotate-z': [{
2627
- 'rotate-z': scaleRotate()
2628
- }],
2629
- /**
2630
- * Scale
2631
- * @see https://tailwindcss.com/docs/scale
2632
- */
2633
- scale: [{
2634
- scale: scaleScale()
2635
- }],
2636
- /**
2637
- * Scale X
2638
- * @see https://tailwindcss.com/docs/scale
2639
- */
2640
- 'scale-x': [{
2641
- 'scale-x': scaleScale()
2642
- }],
2643
- /**
2644
- * Scale Y
2645
- * @see https://tailwindcss.com/docs/scale
2646
- */
2647
- 'scale-y': [{
2648
- 'scale-y': scaleScale()
2649
- }],
2650
- /**
2651
- * Scale Z
2652
- * @see https://tailwindcss.com/docs/scale
2653
- */
2654
- 'scale-z': [{
2655
- 'scale-z': scaleScale()
2656
- }],
2657
- /**
2658
- * Scale 3D
2659
- * @see https://tailwindcss.com/docs/scale
2660
- */
2661
- 'scale-3d': ['scale-3d'],
2662
- /**
2663
- * Skew
2664
- * @see https://tailwindcss.com/docs/skew
2665
- */
2666
- skew: [{
2667
- skew: scaleSkew()
2668
- }],
2669
- /**
2670
- * Skew X
2671
- * @see https://tailwindcss.com/docs/skew
2672
- */
2673
- 'skew-x': [{
2674
- 'skew-x': scaleSkew()
2675
- }],
2676
- /**
2677
- * Skew Y
2678
- * @see https://tailwindcss.com/docs/skew
2679
- */
2680
- 'skew-y': [{
2681
- 'skew-y': scaleSkew()
2682
- }],
2683
- /**
2684
- * Transform
2685
- * @see https://tailwindcss.com/docs/transform
2686
- */
2687
- transform: [{
2688
- transform: [isArbitraryVariable, isArbitraryValue, '', 'none', 'gpu', 'cpu']
2689
- }],
2690
- /**
2691
- * Transform Origin
2692
- * @see https://tailwindcss.com/docs/transform-origin
2693
- */
2694
- 'transform-origin': [{
2695
- origin: scalePositionWithArbitrary()
2696
- }],
2697
- /**
2698
- * Transform Style
2699
- * @see https://tailwindcss.com/docs/transform-style
2700
- */
2701
- 'transform-style': [{
2702
- transform: ['3d', 'flat']
2703
- }],
2704
- /**
2705
- * Translate
2706
- * @see https://tailwindcss.com/docs/translate
2707
- */
2708
- translate: [{
2709
- translate: scaleTranslate()
2710
- }],
2711
- /**
2712
- * Translate X
2713
- * @see https://tailwindcss.com/docs/translate
2714
- */
2715
- 'translate-x': [{
2716
- 'translate-x': scaleTranslate()
2717
- }],
2718
- /**
2719
- * Translate Y
2720
- * @see https://tailwindcss.com/docs/translate
2721
- */
2722
- 'translate-y': [{
2723
- 'translate-y': scaleTranslate()
2724
- }],
2725
- /**
2726
- * Translate Z
2727
- * @see https://tailwindcss.com/docs/translate
2728
- */
2729
- 'translate-z': [{
2730
- 'translate-z': scaleTranslate()
2731
- }],
2732
- /**
2733
- * Translate None
2734
- * @see https://tailwindcss.com/docs/translate
2735
- */
2736
- 'translate-none': ['translate-none'],
2737
- // ---------------------
2738
- // --- Interactivity ---
2739
- // ---------------------
2740
- /**
2741
- * Accent Color
2742
- * @see https://tailwindcss.com/docs/accent-color
2743
- */
2744
- accent: [{
2745
- accent: scaleColor()
2746
- }],
2747
- /**
2748
- * Appearance
2749
- * @see https://tailwindcss.com/docs/appearance
2750
- */
2751
- appearance: [{
2752
- appearance: ['none', 'auto']
2753
- }],
2754
- /**
2755
- * Caret Color
2756
- * @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
2757
- */
2758
- 'caret-color': [{
2759
- caret: scaleColor()
2760
- }],
2761
- /**
2762
- * Color Scheme
2763
- * @see https://tailwindcss.com/docs/color-scheme
2764
- */
2765
- 'color-scheme': [{
2766
- scheme: ['normal', 'dark', 'light', 'light-dark', 'only-dark', 'only-light']
2767
- }],
2768
- /**
2769
- * Cursor
2770
- * @see https://tailwindcss.com/docs/cursor
2771
- */
2772
- cursor: [{
2773
- 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', isArbitraryVariable, isArbitraryValue]
2774
- }],
2775
- /**
2776
- * Field Sizing
2777
- * @see https://tailwindcss.com/docs/field-sizing
2778
- */
2779
- 'field-sizing': [{
2780
- 'field-sizing': ['fixed', 'content']
2781
- }],
2782
- /**
2783
- * Pointer Events
2784
- * @see https://tailwindcss.com/docs/pointer-events
2785
- */
2786
- 'pointer-events': [{
2787
- 'pointer-events': ['auto', 'none']
2788
- }],
2789
- /**
2790
- * Resize
2791
- * @see https://tailwindcss.com/docs/resize
2792
- */
2793
- resize: [{
2794
- resize: ['none', '', 'y', 'x']
2795
- }],
2796
- /**
2797
- * Scroll Behavior
2798
- * @see https://tailwindcss.com/docs/scroll-behavior
2799
- */
2800
- 'scroll-behavior': [{
2801
- scroll: ['auto', 'smooth']
2802
- }],
2803
- /**
2804
- * Scroll Margin
2805
- * @see https://tailwindcss.com/docs/scroll-margin
2806
- */
2807
- 'scroll-m': [{
2808
- 'scroll-m': scaleUnambiguousSpacing()
2809
- }],
2810
- /**
2811
- * Scroll Margin X
2812
- * @see https://tailwindcss.com/docs/scroll-margin
2813
- */
2814
- 'scroll-mx': [{
2815
- 'scroll-mx': scaleUnambiguousSpacing()
2816
- }],
2817
- /**
2818
- * Scroll Margin Y
2819
- * @see https://tailwindcss.com/docs/scroll-margin
2820
- */
2821
- 'scroll-my': [{
2822
- 'scroll-my': scaleUnambiguousSpacing()
2823
- }],
2824
- /**
2825
- * Scroll Margin Start
2826
- * @see https://tailwindcss.com/docs/scroll-margin
2827
- */
2828
- 'scroll-ms': [{
2829
- 'scroll-ms': scaleUnambiguousSpacing()
2830
- }],
2831
- /**
2832
- * Scroll Margin End
2833
- * @see https://tailwindcss.com/docs/scroll-margin
2834
- */
2835
- 'scroll-me': [{
2836
- 'scroll-me': scaleUnambiguousSpacing()
2837
- }],
2838
- /**
2839
- * Scroll Margin Top
2840
- * @see https://tailwindcss.com/docs/scroll-margin
2841
- */
2842
- 'scroll-mt': [{
2843
- 'scroll-mt': scaleUnambiguousSpacing()
2844
- }],
2845
- /**
2846
- * Scroll Margin Right
2847
- * @see https://tailwindcss.com/docs/scroll-margin
2848
- */
2849
- 'scroll-mr': [{
2850
- 'scroll-mr': scaleUnambiguousSpacing()
2851
- }],
2852
- /**
2853
- * Scroll Margin Bottom
2854
- * @see https://tailwindcss.com/docs/scroll-margin
2855
- */
2856
- 'scroll-mb': [{
2857
- 'scroll-mb': scaleUnambiguousSpacing()
2858
- }],
2859
- /**
2860
- * Scroll Margin Left
2861
- * @see https://tailwindcss.com/docs/scroll-margin
2862
- */
2863
- 'scroll-ml': [{
2864
- 'scroll-ml': scaleUnambiguousSpacing()
2865
- }],
2866
- /**
2867
- * Scroll Padding
2868
- * @see https://tailwindcss.com/docs/scroll-padding
2869
- */
2870
- 'scroll-p': [{
2871
- 'scroll-p': scaleUnambiguousSpacing()
2872
- }],
2873
- /**
2874
- * Scroll Padding X
2875
- * @see https://tailwindcss.com/docs/scroll-padding
2876
- */
2877
- 'scroll-px': [{
2878
- 'scroll-px': scaleUnambiguousSpacing()
2879
- }],
2880
- /**
2881
- * Scroll Padding Y
2882
- * @see https://tailwindcss.com/docs/scroll-padding
2883
- */
2884
- 'scroll-py': [{
2885
- 'scroll-py': scaleUnambiguousSpacing()
2886
- }],
2887
- /**
2888
- * Scroll Padding Start
2889
- * @see https://tailwindcss.com/docs/scroll-padding
2890
- */
2891
- 'scroll-ps': [{
2892
- 'scroll-ps': scaleUnambiguousSpacing()
2893
- }],
2894
- /**
2895
- * Scroll Padding End
2896
- * @see https://tailwindcss.com/docs/scroll-padding
2897
- */
2898
- 'scroll-pe': [{
2899
- 'scroll-pe': scaleUnambiguousSpacing()
2900
- }],
2901
- /**
2902
- * Scroll Padding Top
2903
- * @see https://tailwindcss.com/docs/scroll-padding
2904
- */
2905
- 'scroll-pt': [{
2906
- 'scroll-pt': scaleUnambiguousSpacing()
2907
- }],
2908
- /**
2909
- * Scroll Padding Right
2910
- * @see https://tailwindcss.com/docs/scroll-padding
2911
- */
2912
- 'scroll-pr': [{
2913
- 'scroll-pr': scaleUnambiguousSpacing()
2914
- }],
2915
- /**
2916
- * Scroll Padding Bottom
2917
- * @see https://tailwindcss.com/docs/scroll-padding
2918
- */
2919
- 'scroll-pb': [{
2920
- 'scroll-pb': scaleUnambiguousSpacing()
2921
- }],
2922
- /**
2923
- * Scroll Padding Left
2924
- * @see https://tailwindcss.com/docs/scroll-padding
2925
- */
2926
- 'scroll-pl': [{
2927
- 'scroll-pl': scaleUnambiguousSpacing()
2928
- }],
2929
- /**
2930
- * Scroll Snap Align
2931
- * @see https://tailwindcss.com/docs/scroll-snap-align
2932
- */
2933
- 'snap-align': [{
2934
- snap: ['start', 'end', 'center', 'align-none']
2935
- }],
2936
- /**
2937
- * Scroll Snap Stop
2938
- * @see https://tailwindcss.com/docs/scroll-snap-stop
2939
- */
2940
- 'snap-stop': [{
2941
- snap: ['normal', 'always']
2942
- }],
2943
- /**
2944
- * Scroll Snap Type
2945
- * @see https://tailwindcss.com/docs/scroll-snap-type
2946
- */
2947
- 'snap-type': [{
2948
- snap: ['none', 'x', 'y', 'both']
2949
- }],
2950
- /**
2951
- * Scroll Snap Type Strictness
2952
- * @see https://tailwindcss.com/docs/scroll-snap-type
2953
- */
2954
- 'snap-strictness': [{
2955
- snap: ['mandatory', 'proximity']
2956
- }],
2957
- /**
2958
- * Touch Action
2959
- * @see https://tailwindcss.com/docs/touch-action
2960
- */
2961
- touch: [{
2962
- touch: ['auto', 'none', 'manipulation']
2963
- }],
2964
- /**
2965
- * Touch Action X
2966
- * @see https://tailwindcss.com/docs/touch-action
2967
- */
2968
- 'touch-x': [{
2969
- 'touch-pan': ['x', 'left', 'right']
2970
- }],
2971
- /**
2972
- * Touch Action Y
2973
- * @see https://tailwindcss.com/docs/touch-action
2974
- */
2975
- 'touch-y': [{
2976
- 'touch-pan': ['y', 'up', 'down']
2977
- }],
2978
- /**
2979
- * Touch Action Pinch Zoom
2980
- * @see https://tailwindcss.com/docs/touch-action
2981
- */
2982
- 'touch-pz': ['touch-pinch-zoom'],
2983
- /**
2984
- * User Select
2985
- * @see https://tailwindcss.com/docs/user-select
2986
- */
2987
- select: [{
2988
- select: ['none', 'text', 'all', 'auto']
2989
- }],
2990
- /**
2991
- * Will Change
2992
- * @see https://tailwindcss.com/docs/will-change
2993
- */
2994
- 'will-change': [{
2995
- 'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryVariable, isArbitraryValue]
2996
- }],
2997
- // -----------
2998
- // --- SVG ---
2999
- // -----------
3000
- /**
3001
- * Fill
3002
- * @see https://tailwindcss.com/docs/fill
3003
- */
3004
- fill: [{
3005
- fill: ['none', ...scaleColor()]
3006
- }],
3007
- /**
3008
- * Stroke Width
3009
- * @see https://tailwindcss.com/docs/stroke-width
3010
- */
3011
- 'stroke-w': [{
3012
- stroke: [isNumber, isArbitraryVariableLength, isArbitraryLength, isArbitraryNumber]
3013
- }],
3014
- /**
3015
- * Stroke
3016
- * @see https://tailwindcss.com/docs/stroke
3017
- */
3018
- stroke: [{
3019
- stroke: ['none', ...scaleColor()]
3020
- }],
3021
- // ---------------------
3022
- // --- Accessibility ---
3023
- // ---------------------
3024
- /**
3025
- * Forced Color Adjust
3026
- * @see https://tailwindcss.com/docs/forced-color-adjust
3027
- */
3028
- 'forced-color-adjust': [{
3029
- 'forced-color-adjust': ['auto', 'none']
3030
- }]
3031
- },
3032
- conflictingClassGroups: {
3033
- overflow: ['overflow-x', 'overflow-y'],
3034
- overscroll: ['overscroll-x', 'overscroll-y'],
3035
- inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
3036
- 'inset-x': ['right', 'left'],
3037
- 'inset-y': ['top', 'bottom'],
3038
- flex: ['basis', 'grow', 'shrink'],
3039
- gap: ['gap-x', 'gap-y'],
3040
- p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
3041
- px: ['pr', 'pl'],
3042
- py: ['pt', 'pb'],
3043
- m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
3044
- mx: ['mr', 'ml'],
3045
- my: ['mt', 'mb'],
3046
- size: ['w', 'h'],
3047
- 'font-size': ['leading'],
3048
- 'fvn-normal': ['fvn-ordinal', 'fvn-slashed-zero', 'fvn-figure', 'fvn-spacing', 'fvn-fraction'],
3049
- 'fvn-ordinal': ['fvn-normal'],
3050
- 'fvn-slashed-zero': ['fvn-normal'],
3051
- 'fvn-figure': ['fvn-normal'],
3052
- 'fvn-spacing': ['fvn-normal'],
3053
- 'fvn-fraction': ['fvn-normal'],
3054
- 'line-clamp': ['display', 'overflow'],
3055
- 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'],
3056
- 'rounded-s': ['rounded-ss', 'rounded-es'],
3057
- 'rounded-e': ['rounded-se', 'rounded-ee'],
3058
- 'rounded-t': ['rounded-tl', 'rounded-tr'],
3059
- 'rounded-r': ['rounded-tr', 'rounded-br'],
3060
- 'rounded-b': ['rounded-br', 'rounded-bl'],
3061
- 'rounded-l': ['rounded-tl', 'rounded-bl'],
3062
- 'border-spacing': ['border-spacing-x', 'border-spacing-y'],
3063
- 'border-w': ['border-w-x', 'border-w-y', 'border-w-s', 'border-w-e', 'border-w-t', 'border-w-r', 'border-w-b', 'border-w-l'],
3064
- 'border-w-x': ['border-w-r', 'border-w-l'],
3065
- 'border-w-y': ['border-w-t', 'border-w-b'],
3066
- 'border-color': ['border-color-x', 'border-color-y', 'border-color-s', 'border-color-e', 'border-color-t', 'border-color-r', 'border-color-b', 'border-color-l'],
3067
- 'border-color-x': ['border-color-r', 'border-color-l'],
3068
- 'border-color-y': ['border-color-t', 'border-color-b'],
3069
- translate: ['translate-x', 'translate-y', 'translate-none'],
3070
- 'translate-none': ['translate', 'translate-x', 'translate-y', 'translate-z'],
3071
- 'scroll-m': ['scroll-mx', 'scroll-my', 'scroll-ms', 'scroll-me', 'scroll-mt', 'scroll-mr', 'scroll-mb', 'scroll-ml'],
3072
- 'scroll-mx': ['scroll-mr', 'scroll-ml'],
3073
- 'scroll-my': ['scroll-mt', 'scroll-mb'],
3074
- 'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
3075
- 'scroll-px': ['scroll-pr', 'scroll-pl'],
3076
- 'scroll-py': ['scroll-pt', 'scroll-pb'],
3077
- touch: ['touch-x', 'touch-y', 'touch-pz'],
3078
- 'touch-x': ['touch'],
3079
- 'touch-y': ['touch'],
3080
- 'touch-pz': ['touch']
3081
- },
3082
- conflictingClassGroupModifiers: {
3083
- 'font-size': ['leading']
3084
- },
3085
- orderSensitiveModifiers: ['*', '**', 'after', 'backdrop', 'before', 'details-content', 'file', 'first-letter', 'first-line', 'marker', 'placeholder', 'selection']
3086
- };
3087
- };
3088
- const twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
3089
14
 
3090
15
  function cn(...inputs) {
3091
16
  return twMerge(clsx(inputs));
@@ -3249,14 +174,14 @@ const NumberSetter = props => {
3249
174
  return /*#__PURE__*/jsxs("div", {
3250
175
  className: "relative w-full",
3251
176
  children: [/*#__PURE__*/jsx(Input, {
3252
- className: cn('!text-xs h-8 px-2 py-[5px] pr-8 [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none', !!suffix && 'pr-8'),
177
+ className: cn('h-8 px-2 py-[5px] pr-8 text-xs! [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none', !!suffix && 'pr-8'),
3253
178
  onChange: e => onChange(+e.target.value),
3254
179
  placeholder: placeholder || '',
3255
180
  type: "number",
3256
181
  value: value ?? initialValue
3257
182
  }), !!suffix && /*#__PURE__*/jsx("span", {
3258
183
  "aria-label": `Unit: ${suffix}`,
3259
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
184
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3260
185
  children: suffix
3261
186
  })]
3262
187
  });
@@ -3276,51 +201,51 @@ const RectSetter = props => {
3276
201
  return /*#__PURE__*/jsxs("div", {
3277
202
  className: "flex w-full flex-wrap gap-2",
3278
203
  children: [/*#__PURE__*/jsxs("div", {
3279
- className: "relative w-[calc(50%_-_4px)]",
204
+ className: "relative w-[calc(50%-4px)]",
3280
205
  children: [/*#__PURE__*/jsx(Input, {
3281
- className: "!text-xs h-8 px-2 py-[5px] pr-8 [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
206
+ className: "h-8 px-2 py-[5px] pr-8 text-xs! [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
3282
207
  onChange: e => handleChange('x', Number(e.target.value)),
3283
208
  type: "number",
3284
209
  value: formatDecimal(value.x)
3285
210
  }), /*#__PURE__*/jsx("span", {
3286
211
  "aria-label": 'Unit: X',
3287
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
212
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3288
213
  children: "X"
3289
214
  })]
3290
215
  }), /*#__PURE__*/jsxs("div", {
3291
- className: "relative w-[calc(50%_-_4px)]",
216
+ className: "relative w-[calc(50%-4px)]",
3292
217
  children: [/*#__PURE__*/jsx(Input, {
3293
- className: "!text-xs h-8 px-2 py-[5px] pr-8 [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
218
+ className: "h-8 px-2 py-[5px] pr-8 text-xs! [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
3294
219
  onChange: e => handleChange('y', Number(e.target.value)),
3295
220
  type: "number",
3296
221
  value: formatDecimal(value.y)
3297
222
  }), /*#__PURE__*/jsx("span", {
3298
223
  "aria-label": 'Unit: Y',
3299
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
224
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3300
225
  children: "Y"
3301
226
  })]
3302
227
  }), /*#__PURE__*/jsxs("div", {
3303
- className: "relative w-[calc(50%_-_4px)]",
228
+ className: "relative w-[calc(50%-4px)]",
3304
229
  children: [/*#__PURE__*/jsx(Input, {
3305
- className: "!text-xs h-8 px-2 py-[5px] pr-8 [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
230
+ className: "h-8 px-2 py-[5px] pr-8 text-xs! [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
3306
231
  onChange: e => handleChange('width', Number(e.target.value)),
3307
232
  type: "number",
3308
233
  value: formatDecimal(value.width)
3309
234
  }), /*#__PURE__*/jsx("span", {
3310
235
  "aria-label": 'Unit: W',
3311
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
236
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3312
237
  children: "W"
3313
238
  })]
3314
239
  }), /*#__PURE__*/jsxs("div", {
3315
- className: "relative w-[calc(50%_-_4px)]",
240
+ className: "relative w-[calc(50%-4px)]",
3316
241
  children: [/*#__PURE__*/jsx(Input, {
3317
- className: "!text-xs h-8 px-2 py-[5px] pr-8 [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
242
+ className: "h-8 px-2 py-[5px] pr-8 text-xs! [-moz-appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
3318
243
  onChange: e => handleChange('height', Number(e.target.value)),
3319
244
  type: "number",
3320
245
  value: formatDecimal(value.height)
3321
246
  }), /*#__PURE__*/jsx("span", {
3322
247
  "aria-label": 'Unit: H',
3323
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
248
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3324
249
  children: "H"
3325
250
  })]
3326
251
  })]
@@ -3340,13 +265,13 @@ const StringSetter = props => {
3340
265
  return /*#__PURE__*/jsxs("div", {
3341
266
  className: "relative w-full",
3342
267
  children: [/*#__PURE__*/jsx(Input, {
3343
- className: cn('!text-xs h-8 px-2 py-[5px]', !!suffix && 'pr-8'),
268
+ className: cn('h-8 px-2 py-[5px] text-xs!', !!suffix && 'pr-8'),
3344
269
  onChange: e => onChange(e.target.value),
3345
270
  placeholder: placeholder || '',
3346
271
  value: value || initialValue
3347
272
  }), !!suffix && /*#__PURE__*/jsx("span", {
3348
273
  "aria-label": `Unit: ${suffix}`,
3349
- className: "-translate-y-1/2 pointer-events-none absolute top-1/2 right-3 text-muted-foreground",
274
+ className: "pointer-events-none absolute top-1/2 right-3 -translate-y-1/2 text-muted-foreground",
3350
275
  children: suffix
3351
276
  })]
3352
277
  });
@@ -3535,7 +460,7 @@ const CollapseSetter = props => {
3535
460
  } = props;
3536
461
  const [isOpen, setIsOpen] = useState(initialValue ?? true);
3537
462
  return /*#__PURE__*/jsxs(Collapsible, {
3538
- className: "-translate-x-4 w-[calc(100%_+_32px)] space-y-2",
463
+ className: "w-[calc(100%+32px)] -translate-x-4 space-y-2",
3539
464
  onOpenChange: setIsOpen,
3540
465
  open: isOpen,
3541
466
  children: [/*#__PURE__*/jsxs("div", {
@@ -3610,7 +535,9 @@ const TabSetter = props => {
3610
535
  children
3611
536
  } = props;
3612
537
  const tabsList = React__default.useMemo(() => {
3613
- if (tabs) return tabs;
538
+ if (tabs) {
539
+ return tabs;
540
+ }
3614
541
  if (Array.isArray(children) && children.length > 0) {
3615
542
  return children.map(child => ({
3616
543
  label: child.props.field.config.title,
@@ -3640,51 +567,6 @@ const TabSetter = props => {
3640
567
  });
3641
568
  };
3642
569
 
3643
- const SetterGroup = {
3644
- BASIC: 'basic',
3645
- ADVANCED: 'advanced',
3646
- LAYOUT: 'layout',
3647
- GROUP: 'group'
3648
- };
3649
-
3650
- function Label({
3651
- className,
3652
- ...props
3653
- }) {
3654
- return /*#__PURE__*/jsx(LabelPrimitive.Root, {
3655
- "data-slot": "label",
3656
- className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className),
3657
- ...props
3658
- });
3659
- }
3660
-
3661
- const customFieldItem = (field, setter) => {
3662
- const {
3663
- label = true,
3664
- wrap = false
3665
- } = field.config.extraProps || {};
3666
- if (typeof label === 'boolean' && !label) {
3667
- return /*#__PURE__*/jsx("div", {
3668
- className: "flex w-full items-center",
3669
- children: setter
3670
- });
3671
- }
3672
- return /*#__PURE__*/jsxs("div", {
3673
- className: cn('flex w-full text-xs', wrap ? 'flex-col' : 'items-center'),
3674
- children: [/*#__PURE__*/jsx(Label, {
3675
- className: cn('shrink-0 grow-0 text-xs', wrap ? 'basis-[26px]' : 'basis-[100px]'),
3676
- htmlFor: field.id,
3677
- children: field.title
3678
- }), /*#__PURE__*/jsx("div", {
3679
- className: "flex flex-1 items-center justify-between",
3680
- children: /*#__PURE__*/jsx("div", {
3681
- className: "flex-1",
3682
- children: setter
3683
- })
3684
- })]
3685
- });
3686
- };
3687
-
3688
570
  const setterMap = {
3689
571
  ColorSetter,
3690
572
  NodeIdSetter,
@@ -3697,5 +579,5 @@ const setterMap = {
3697
579
  TabSetter
3698
580
  };
3699
581
 
3700
- export { CollapseSetter, ColorSetter, NodeIdSetter, NumberSetter, RectSetter, SetterGroup, StringSetter, SwitchSetter, TabSetter, UploadSetter, customFieldItem, setterMap as default, setterMap };
582
+ export { CollapseSetter, ColorSetter, NodeIdSetter, NumberSetter, RectSetter, StringSetter, SwitchSetter, TabSetter, UploadSetter, setterMap as default, setterMap };
3701
583
  //# sourceMappingURL=index.esm.js.map