@lukso/web-components 1.51.6 → 1.52.0

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.
Files changed (90) hide show
  1. package/dist/{cn-3e29cec8.js → cn-1594f5ba.js} +342 -308
  2. package/dist/{cn-98077c72.cjs → cn-312c6e88.cjs} +345 -311
  3. package/dist/components/index.cjs +6 -6
  4. package/dist/components/index.js +6 -6
  5. package/dist/components/lukso-button/index.cjs +2656 -75
  6. package/dist/components/lukso-button/index.d.ts +3 -12
  7. package/dist/components/lukso-button/index.d.ts.map +1 -1
  8. package/dist/components/lukso-button/index.js +2656 -75
  9. package/dist/components/lukso-button/lukso-button.stories.d.ts +4 -0
  10. package/dist/components/lukso-button/lukso-button.stories.d.ts.map +1 -1
  11. package/dist/components/lukso-card/index.cjs +5 -5
  12. package/dist/components/lukso-card/index.js +5 -5
  13. package/dist/components/lukso-checkbox/index.cjs +1 -1
  14. package/dist/components/lukso-checkbox/index.js +1 -1
  15. package/dist/components/lukso-footer/index.cjs +1 -1
  16. package/dist/components/lukso-footer/index.js +1 -1
  17. package/dist/components/lukso-icon/index.cjs +2 -2
  18. package/dist/components/lukso-icon/index.js +2 -2
  19. package/dist/components/lukso-input/index.cjs +1 -1
  20. package/dist/components/lukso-input/index.js +1 -1
  21. package/dist/components/lukso-modal/index.cjs +1 -1
  22. package/dist/components/lukso-modal/index.js +1 -1
  23. package/dist/components/lukso-navbar/index.cjs +2 -2
  24. package/dist/components/lukso-navbar/index.js +2 -2
  25. package/dist/components/lukso-profile/index.cjs +2 -2
  26. package/dist/components/lukso-profile/index.js +2 -2
  27. package/dist/components/lukso-progress/index.cjs +4 -4
  28. package/dist/components/lukso-progress/index.js +4 -4
  29. package/dist/components/lukso-sanitize/index.cjs +1 -1
  30. package/dist/components/lukso-sanitize/index.js +1 -1
  31. package/dist/components/lukso-search/index.cjs +3 -3
  32. package/dist/components/lukso-search/index.js +3 -3
  33. package/dist/components/lukso-select/index.cjs +3 -3
  34. package/dist/components/lukso-select/index.js +3 -3
  35. package/dist/components/lukso-share/index.cjs +1 -1
  36. package/dist/components/lukso-share/index.js +1 -1
  37. package/dist/components/lukso-switch/index.cjs +2 -2
  38. package/dist/components/lukso-switch/index.js +2 -2
  39. package/dist/components/lukso-tag/index.cjs +2 -2
  40. package/dist/components/lukso-tag/index.js +2 -2
  41. package/dist/components/lukso-terms/index.cjs +2 -2
  42. package/dist/components/lukso-terms/index.js +2 -2
  43. package/dist/components/lukso-test/index.cjs +1 -1
  44. package/dist/components/lukso-test/index.js +1 -1
  45. package/dist/components/lukso-tooltip/index.cjs +1 -1
  46. package/dist/components/lukso-tooltip/index.js +1 -1
  47. package/dist/components/lukso-username/index.cjs +2 -2
  48. package/dist/components/lukso-username/index.js +2 -2
  49. package/dist/components/lukso-wizard/index.cjs +1 -1
  50. package/dist/components/lukso-wizard/index.js +1 -1
  51. package/dist/index-35ca0b42.js +39 -0
  52. package/dist/{index-ee4182e6.js → index-739869da.js} +1 -1
  53. package/dist/{index-beb7703d.cjs → index-ace51f33.cjs} +1 -1
  54. package/dist/index-f426e548.cjs +46 -0
  55. package/dist/index.cjs +6 -6
  56. package/dist/index.js +6 -6
  57. package/dist/shared/tailwind-element/index.cjs +1 -1
  58. package/dist/shared/tailwind-element/index.js +1 -1
  59. package/dist/{style-map-671a0511.cjs → style-map-1175c018.cjs} +1 -1
  60. package/dist/{style-map-5be28c06.js → style-map-17f918a2.js} +1 -1
  61. package/dist/styles/main.css +1 -1
  62. package/dist/{color-palette.cjs → tailwind-config.cjs} +101 -0
  63. package/dist/tailwind-config.d.ts +136 -0
  64. package/dist/tailwind-config.d.ts.map +1 -0
  65. package/{tools/color-palette-18dd9e2f.cjs → dist/tailwind-config.js} +95 -7
  66. package/package.json +8 -5
  67. package/tailwind.config.cjs +8 -118
  68. package/tools/cn.cjs +341 -307
  69. package/tools/cn.d.ts.map +1 -1
  70. package/tools/cn.js +341 -307
  71. package/tools/index.cjs +13 -6
  72. package/tools/index.d.ts +1 -1
  73. package/tools/index.d.ts.map +1 -1
  74. package/tools/index.js +1 -1
  75. package/tools/sass/fonts.scss +1 -1
  76. package/tools/styles/main.css +1 -1
  77. package/tools/{color-palette-2786d7c1.js → tailwind-config-0df99c97.js} +95 -1
  78. package/{dist/color-palette.js → tools/tailwind-config-f8a808f6.cjs} +108 -1
  79. package/tools/tailwind-config.cjs +19 -0
  80. package/tools/tailwind-config.d.ts +136 -0
  81. package/tools/tailwind-config.d.ts.map +1 -0
  82. package/tools/tailwind-config.js +1 -0
  83. package/dist/color-palette.d.ts +0 -42
  84. package/dist/color-palette.d.ts.map +0 -1
  85. package/dist/index-04d11436.js +0 -39
  86. package/dist/index-997f3f0e.cjs +0 -46
  87. package/tools/color-palette.cjs +0 -12
  88. package/tools/color-palette.d.ts +0 -42
  89. package/tools/color-palette.d.ts.map +0 -1
  90. package/tools/color-palette.js +0 -1
package/tools/cn.cjs CHANGED
@@ -2,55 +2,17 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- /**
6
- * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
7
- *
8
- * Specifically:
9
- * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
10
- * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
11
- *
12
- * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
13
- */
14
- function twJoin() {
15
- var index = 0;
16
- var argument;
17
- var resolvedValue;
18
- var string = '';
19
- while (index < arguments.length) {
20
- if (argument = arguments[index++]) {
21
- if (resolvedValue = toValue(argument)) {
22
- string && (string += ' ');
23
- string += resolvedValue;
24
- }
25
- }
26
- }
27
- return string;
28
- }
29
- function toValue(mix) {
30
- if (typeof mix === 'string') {
31
- return mix;
32
- }
33
- var resolvedValue;
34
- var string = '';
35
- for (var k = 0; k < mix.length; k++) {
36
- if (mix[k]) {
37
- if (resolvedValue = toValue(mix[k])) {
38
- string && (string += ' ');
39
- string += resolvedValue;
40
- }
41
- }
42
- }
43
- return string;
44
- }
5
+ const tailwindConfig = require('./tailwind-config-f8a808f6.cjs');
45
6
 
46
- var CLASS_PART_SEPARATOR = '-';
7
+ const CLASS_PART_SEPARATOR = '-';
47
8
  function createClassUtils(config) {
48
- var classMap = createClassMap(config);
49
- var conflictingClassGroups = config.conflictingClassGroups,
50
- _config$conflictingCl = config.conflictingClassGroupModifiers,
51
- conflictingClassGroupModifiers = _config$conflictingCl === void 0 ? {} : _config$conflictingCl;
9
+ const classMap = createClassMap(config);
10
+ const {
11
+ conflictingClassGroups,
12
+ conflictingClassGroupModifiers
13
+ } = config;
52
14
  function getClassGroupId(className) {
53
- var classParts = className.split(CLASS_PART_SEPARATOR);
15
+ const classParts = className.split(CLASS_PART_SEPARATOR);
54
16
  // Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
55
17
  if (classParts[0] === '' && classParts.length !== 1) {
56
18
  classParts.shift();
@@ -58,41 +20,40 @@ function createClassUtils(config) {
58
20
  return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
59
21
  }
60
22
  function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
61
- var conflicts = conflictingClassGroups[classGroupId] || [];
23
+ const conflicts = conflictingClassGroups[classGroupId] || [];
62
24
  if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
63
- return [].concat(conflicts, conflictingClassGroupModifiers[classGroupId]);
25
+ return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
64
26
  }
65
27
  return conflicts;
66
28
  }
67
29
  return {
68
- getClassGroupId: getClassGroupId,
69
- getConflictingClassGroupIds: getConflictingClassGroupIds
30
+ getClassGroupId,
31
+ getConflictingClassGroupIds
70
32
  };
71
33
  }
72
34
  function getGroupRecursive(classParts, classPartObject) {
73
35
  if (classParts.length === 0) {
74
36
  return classPartObject.classGroupId;
75
37
  }
76
- var currentClassPart = classParts[0];
77
- var nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
78
- var classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
38
+ const currentClassPart = classParts[0];
39
+ const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
40
+ const classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
79
41
  if (classGroupFromNextClassPart) {
80
42
  return classGroupFromNextClassPart;
81
43
  }
82
44
  if (classPartObject.validators.length === 0) {
83
45
  return undefined;
84
46
  }
85
- var classRest = classParts.join(CLASS_PART_SEPARATOR);
86
- return classPartObject.validators.find(function (_ref) {
87
- var validator = _ref.validator;
88
- return validator(classRest);
89
- })?.classGroupId;
47
+ const classRest = classParts.join(CLASS_PART_SEPARATOR);
48
+ return classPartObject.validators.find(({
49
+ validator
50
+ }) => validator(classRest))?.classGroupId;
90
51
  }
91
- var arbitraryPropertyRegex = /^\[(.+)\]$/;
52
+ const arbitraryPropertyRegex = /^\[(.+)\]$/;
92
53
  function getGroupIdForArbitraryProperty(className) {
93
54
  if (arbitraryPropertyRegex.test(className)) {
94
- var arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
95
- var property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
55
+ const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
56
+ const property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
96
57
  if (property) {
97
58
  // I use two dots here because one dot is used as prefix for class groups in plugins
98
59
  return 'arbitrary..' + property;
@@ -103,24 +64,24 @@ function getGroupIdForArbitraryProperty(className) {
103
64
  * Exported for testing only
104
65
  */
105
66
  function createClassMap(config) {
106
- var theme = config.theme,
107
- prefix = config.prefix;
108
- var classMap = {
67
+ const {
68
+ theme,
69
+ prefix
70
+ } = config;
71
+ const classMap = {
109
72
  nextPart: new Map(),
110
73
  validators: []
111
74
  };
112
- var prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
113
- prefixedClassGroupEntries.forEach(function (_ref2) {
114
- var classGroupId = _ref2[0],
115
- classGroup = _ref2[1];
75
+ const prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
76
+ prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
116
77
  processClassesRecursively(classGroup, classMap, classGroupId, theme);
117
78
  });
118
79
  return classMap;
119
80
  }
120
81
  function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
121
- classGroup.forEach(function (classDefinition) {
82
+ classGroup.forEach(classDefinition => {
122
83
  if (typeof classDefinition === 'string') {
123
- var classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
84
+ const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
124
85
  classPartObjectToEdit.classGroupId = classGroupId;
125
86
  return;
126
87
  }
@@ -131,20 +92,18 @@ function processClassesRecursively(classGroup, classPartObject, classGroupId, th
131
92
  }
132
93
  classPartObject.validators.push({
133
94
  validator: classDefinition,
134
- classGroupId: classGroupId
95
+ classGroupId
135
96
  });
136
97
  return;
137
98
  }
138
- Object.entries(classDefinition).forEach(function (_ref3) {
139
- var key = _ref3[0],
140
- classGroup = _ref3[1];
99
+ Object.entries(classDefinition).forEach(([key, classGroup]) => {
141
100
  processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
142
101
  });
143
102
  });
144
103
  }
145
104
  function getPart(classPartObject, path) {
146
- var currentClassPartObject = classPartObject;
147
- path.split(CLASS_PART_SEPARATOR).forEach(function (pathPart) {
105
+ let currentClassPartObject = classPartObject;
106
+ path.split(CLASS_PART_SEPARATOR).forEach(pathPart => {
148
107
  if (!currentClassPartObject.nextPart.has(pathPart)) {
149
108
  currentClassPartObject.nextPart.set(pathPart, {
150
109
  nextPart: new Map(),
@@ -162,19 +121,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
162
121
  if (!prefix) {
163
122
  return classGroupEntries;
164
123
  }
165
- return classGroupEntries.map(function (_ref4) {
166
- var classGroupId = _ref4[0],
167
- classGroup = _ref4[1];
168
- var prefixedClassGroup = classGroup.map(function (classDefinition) {
124
+ return classGroupEntries.map(([classGroupId, classGroup]) => {
125
+ const prefixedClassGroup = classGroup.map(classDefinition => {
169
126
  if (typeof classDefinition === 'string') {
170
127
  return prefix + classDefinition;
171
128
  }
172
129
  if (typeof classDefinition === 'object') {
173
- return Object.fromEntries(Object.entries(classDefinition).map(function (_ref5) {
174
- var key = _ref5[0],
175
- value = _ref5[1];
176
- return [prefix + key, value];
177
- }));
130
+ return Object.fromEntries(Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]));
178
131
  }
179
132
  return classDefinition;
180
133
  });
@@ -186,15 +139,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
186
139
  function createLruCache(maxCacheSize) {
187
140
  if (maxCacheSize < 1) {
188
141
  return {
189
- get: function get() {
190
- return undefined;
191
- },
192
- set: function set() {}
142
+ get: () => undefined,
143
+ set: () => {}
193
144
  };
194
145
  }
195
- var cacheSize = 0;
196
- var cache = new Map();
197
- var previousCache = new Map();
146
+ let cacheSize = 0;
147
+ let cache = new Map();
148
+ let previousCache = new Map();
198
149
  function update(key, value) {
199
150
  cache.set(key, value);
200
151
  cacheSize++;
@@ -205,8 +156,8 @@ function createLruCache(maxCacheSize) {
205
156
  }
206
157
  }
207
158
  return {
208
- get: function get(key) {
209
- var value = cache.get(key);
159
+ get(key) {
160
+ let value = cache.get(key);
210
161
  if (value !== undefined) {
211
162
  return value;
212
163
  }
@@ -215,7 +166,7 @@ function createLruCache(maxCacheSize) {
215
166
  return value;
216
167
  }
217
168
  },
218
- set: function set(key, value) {
169
+ set(key, value) {
219
170
  if (cache.has(key)) {
220
171
  cache.set(key, value);
221
172
  } else {
@@ -224,21 +175,20 @@ function createLruCache(maxCacheSize) {
224
175
  }
225
176
  };
226
177
  }
227
-
228
- var IMPORTANT_MODIFIER = '!';
178
+ const IMPORTANT_MODIFIER = '!';
229
179
  function createSplitModifiers(config) {
230
- var separator = config.separator || ':';
231
- var isSeparatorSingleCharacter = separator.length === 1;
232
- var firstSeparatorCharacter = separator[0];
233
- var separatorLength = separator.length;
180
+ const separator = config.separator;
181
+ const isSeparatorSingleCharacter = separator.length === 1;
182
+ const firstSeparatorCharacter = separator[0];
183
+ const separatorLength = separator.length;
234
184
  // splitModifiers inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
235
185
  return function splitModifiers(className) {
236
- var modifiers = [];
237
- var bracketDepth = 0;
238
- var modifierStart = 0;
239
- var postfixModifierPosition;
240
- for (var index = 0; index < className.length; index++) {
241
- var currentCharacter = className[index];
186
+ const modifiers = [];
187
+ let bracketDepth = 0;
188
+ let modifierStart = 0;
189
+ let postfixModifierPosition;
190
+ for (let index = 0; index < className.length; index++) {
191
+ let currentCharacter = className[index];
242
192
  if (bracketDepth === 0) {
243
193
  if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
244
194
  modifiers.push(className.slice(modifierStart, index));
@@ -256,15 +206,15 @@ function createSplitModifiers(config) {
256
206
  bracketDepth--;
257
207
  }
258
208
  }
259
- var baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
260
- var hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
261
- var baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
262
- var maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
209
+ const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
210
+ const hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
211
+ const baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
212
+ const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
263
213
  return {
264
- modifiers: modifiers,
265
- hasImportantModifier: hasImportantModifier,
266
- baseClassName: baseClassName,
267
- maybePostfixModifierPosition: maybePostfixModifierPosition
214
+ modifiers,
215
+ hasImportantModifier,
216
+ baseClassName,
217
+ maybePostfixModifierPosition
268
218
  };
269
219
  };
270
220
  }
@@ -277,21 +227,20 @@ function sortModifiers(modifiers) {
277
227
  if (modifiers.length <= 1) {
278
228
  return modifiers;
279
229
  }
280
- var sortedModifiers = [];
281
- var unsortedModifiers = [];
282
- modifiers.forEach(function (modifier) {
283
- var isArbitraryVariant = modifier[0] === '[';
230
+ const sortedModifiers = [];
231
+ let unsortedModifiers = [];
232
+ modifiers.forEach(modifier => {
233
+ const isArbitraryVariant = modifier[0] === '[';
284
234
  if (isArbitraryVariant) {
285
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort().concat([modifier]));
235
+ sortedModifiers.push(...unsortedModifiers.sort(), modifier);
286
236
  unsortedModifiers = [];
287
237
  } else {
288
238
  unsortedModifiers.push(modifier);
289
239
  }
290
240
  });
291
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort());
241
+ sortedModifiers.push(...unsortedModifiers.sort());
292
242
  return sortedModifiers;
293
243
  }
294
-
295
244
  function createConfigUtils(config) {
296
245
  return {
297
246
  cache: createLruCache(config.cacheSize),
@@ -299,12 +248,13 @@ function createConfigUtils(config) {
299
248
  ...createClassUtils(config)
300
249
  };
301
250
  }
302
-
303
- var SPLIT_CLASSES_REGEX = /\s+/;
251
+ const SPLIT_CLASSES_REGEX = /\s+/;
304
252
  function mergeClassList(classList, configUtils) {
305
- var splitModifiers = configUtils.splitModifiers,
306
- getClassGroupId = configUtils.getClassGroupId,
307
- getConflictingClassGroupIds = configUtils.getConflictingClassGroupIds;
253
+ const {
254
+ splitModifiers,
255
+ getClassGroupId,
256
+ getConflictingClassGroupIds
257
+ } = configUtils;
308
258
  /**
309
259
  * Set of classGroupIds in following format:
310
260
  * `{importantModifier}{variantModifiers}{classGroupId}`
@@ -312,77 +262,109 @@ function mergeClassList(classList, configUtils) {
312
262
  * @example 'hover:focus:bg-color'
313
263
  * @example 'md:!pr'
314
264
  */
315
- var classGroupsInConflict = new Set();
316
- return classList.trim().split(SPLIT_CLASSES_REGEX).map(function (originalClassName) {
317
- var _splitModifiers = splitModifiers(originalClassName),
318
- modifiers = _splitModifiers.modifiers,
319
- hasImportantModifier = _splitModifiers.hasImportantModifier,
320
- baseClassName = _splitModifiers.baseClassName,
321
- maybePostfixModifierPosition = _splitModifiers.maybePostfixModifierPosition;
322
- var classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
323
- var hasPostfixModifier = Boolean(maybePostfixModifierPosition);
265
+ const classGroupsInConflict = new Set();
266
+ return classList.trim().split(SPLIT_CLASSES_REGEX).map(originalClassName => {
267
+ const {
268
+ modifiers,
269
+ hasImportantModifier,
270
+ baseClassName,
271
+ maybePostfixModifierPosition
272
+ } = splitModifiers(originalClassName);
273
+ let classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
274
+ let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
324
275
  if (!classGroupId) {
325
276
  if (!maybePostfixModifierPosition) {
326
277
  return {
327
278
  isTailwindClass: false,
328
- originalClassName: originalClassName
279
+ originalClassName
329
280
  };
330
281
  }
331
282
  classGroupId = getClassGroupId(baseClassName);
332
283
  if (!classGroupId) {
333
284
  return {
334
285
  isTailwindClass: false,
335
- originalClassName: originalClassName
286
+ originalClassName
336
287
  };
337
288
  }
338
289
  hasPostfixModifier = false;
339
290
  }
340
- var variantModifier = sortModifiers(modifiers).join(':');
341
- var modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
291
+ const variantModifier = sortModifiers(modifiers).join(':');
292
+ const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
342
293
  return {
343
294
  isTailwindClass: true,
344
- modifierId: modifierId,
345
- classGroupId: classGroupId,
346
- originalClassName: originalClassName,
347
- hasPostfixModifier: hasPostfixModifier
295
+ modifierId,
296
+ classGroupId,
297
+ originalClassName,
298
+ hasPostfixModifier
348
299
  };
349
300
  }).reverse()
350
301
  // Last class in conflict wins, so we need to filter conflicting classes in reverse order.
351
- .filter(function (parsed) {
302
+ .filter(parsed => {
352
303
  if (!parsed.isTailwindClass) {
353
304
  return true;
354
305
  }
355
- var modifierId = parsed.modifierId,
356
- classGroupId = parsed.classGroupId,
357
- hasPostfixModifier = parsed.hasPostfixModifier;
358
- var classId = modifierId + classGroupId;
306
+ const {
307
+ modifierId,
308
+ classGroupId,
309
+ hasPostfixModifier
310
+ } = parsed;
311
+ const classId = modifierId + classGroupId;
359
312
  if (classGroupsInConflict.has(classId)) {
360
313
  return false;
361
314
  }
362
315
  classGroupsInConflict.add(classId);
363
- getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(function (group) {
364
- return classGroupsInConflict.add(modifierId + group);
365
- });
316
+ getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(group => classGroupsInConflict.add(modifierId + group));
366
317
  return true;
367
- }).reverse().map(function (parsed) {
368
- return parsed.originalClassName;
369
- }).join(' ');
318
+ }).reverse().map(parsed => parsed.originalClassName).join(' ');
370
319
  }
371
320
 
372
- function createTailwindMerge() {
373
- for (var _len = arguments.length, createConfig = new Array(_len), _key = 0; _key < _len; _key++) {
374
- createConfig[_key] = arguments[_key];
321
+ /**
322
+ * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
323
+ *
324
+ * Specifically:
325
+ * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
326
+ * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
327
+ *
328
+ * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
329
+ */
330
+ function twJoin() {
331
+ let index = 0;
332
+ let argument;
333
+ let resolvedValue;
334
+ let string = '';
335
+ while (index < arguments.length) {
336
+ if (argument = arguments[index++]) {
337
+ if (resolvedValue = toValue(argument)) {
338
+ string && (string += ' ');
339
+ string += resolvedValue;
340
+ }
341
+ }
375
342
  }
376
- var configUtils;
377
- var cacheGet;
378
- var cacheSet;
379
- var functionToCall = initTailwindMerge;
343
+ return string;
344
+ }
345
+ function toValue(mix) {
346
+ if (typeof mix === 'string') {
347
+ return mix;
348
+ }
349
+ let resolvedValue;
350
+ let string = '';
351
+ for (let k = 0; k < mix.length; k++) {
352
+ if (mix[k]) {
353
+ if (resolvedValue = toValue(mix[k])) {
354
+ string && (string += ' ');
355
+ string += resolvedValue;
356
+ }
357
+ }
358
+ }
359
+ return string;
360
+ }
361
+ function createTailwindMerge(createConfigFirst, ...createConfigRest) {
362
+ let configUtils;
363
+ let cacheGet;
364
+ let cacheSet;
365
+ let functionToCall = initTailwindMerge;
380
366
  function initTailwindMerge(classList) {
381
- var firstCreateConfig = createConfig[0],
382
- restCreateConfig = createConfig.slice(1);
383
- var config = restCreateConfig.reduce(function (previousConfig, createConfigCurrent) {
384
- return createConfigCurrent(previousConfig);
385
- }, firstCreateConfig());
367
+ const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
386
368
  configUtils = createConfigUtils(config);
387
369
  cacheGet = configUtils.cache.get;
388
370
  cacheSet = configUtils.cache.set;
@@ -390,11 +372,11 @@ function createTailwindMerge() {
390
372
  return tailwindMerge(classList);
391
373
  }
392
374
  function tailwindMerge(classList) {
393
- var cachedResult = cacheGet(classList);
375
+ const cachedResult = cacheGet(classList);
394
376
  if (cachedResult) {
395
377
  return cachedResult;
396
378
  }
397
- var result = mergeClassList(classList, configUtils);
379
+ const result = mergeClassList(classList, configUtils);
398
380
  cacheSet(classList, result);
399
381
  return result;
400
382
  }
@@ -402,66 +384,65 @@ function createTailwindMerge() {
402
384
  return functionToCall(twJoin.apply(null, arguments));
403
385
  };
404
386
  }
405
-
406
387
  function fromTheme(key) {
407
- var themeGetter = function themeGetter(theme) {
408
- return theme[key] || [];
409
- };
388
+ const themeGetter = theme => theme[key] || [];
410
389
  themeGetter.isThemeGetter = true;
411
390
  return themeGetter;
412
391
  }
413
-
414
- var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
415
- var fractionRegex = /^\d+\/\d+$/;
416
- var stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
417
- var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
418
- var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
392
+ const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
393
+ const fractionRegex = /^\d+\/\d+$/;
394
+ const stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
395
+ const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
396
+ 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$/;
419
397
  // Shadow always begins with x and y offset separated by underscore
420
- var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
398
+ const shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
399
+ const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
421
400
  function isLength(value) {
422
- return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value) || isArbitraryLength(value);
401
+ return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
423
402
  }
424
403
  function isArbitraryLength(value) {
425
404
  return getIsArbitraryValue(value, 'length', isLengthOnly);
426
405
  }
427
- function isArbitrarySize(value) {
428
- return getIsArbitraryValue(value, 'size', isNever);
429
- }
430
- function isArbitraryPosition(value) {
431
- return getIsArbitraryValue(value, 'position', isNever);
432
- }
433
- function isArbitraryUrl(value) {
434
- return getIsArbitraryValue(value, 'url', isUrl);
406
+ function isNumber(value) {
407
+ return Boolean(value) && !Number.isNaN(Number(value));
435
408
  }
436
409
  function isArbitraryNumber(value) {
437
410
  return getIsArbitraryValue(value, 'number', isNumber);
438
411
  }
439
- function isNumber(value) {
440
- return !Number.isNaN(Number(value));
412
+ function isInteger(value) {
413
+ return Boolean(value) && Number.isInteger(Number(value));
441
414
  }
442
415
  function isPercent(value) {
443
416
  return value.endsWith('%') && isNumber(value.slice(0, -1));
444
417
  }
445
- function isInteger(value) {
446
- return isIntegerOnly(value) || getIsArbitraryValue(value, 'number', isIntegerOnly);
447
- }
448
418
  function isArbitraryValue(value) {
449
419
  return arbitraryValueRegex.test(value);
450
420
  }
451
- function isAny() {
452
- return true;
453
- }
454
421
  function isTshirtSize(value) {
455
422
  return tshirtUnitRegex.test(value);
456
423
  }
424
+ const sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
425
+ function isArbitrarySize(value) {
426
+ return getIsArbitraryValue(value, sizeLabels, isNever);
427
+ }
428
+ function isArbitraryPosition(value) {
429
+ return getIsArbitraryValue(value, 'position', isNever);
430
+ }
431
+ const imageLabels = /*#__PURE__*/new Set(['image', 'url']);
432
+ function isArbitraryImage(value) {
433
+ return getIsArbitraryValue(value, imageLabels, isImage);
434
+ }
457
435
  function isArbitraryShadow(value) {
458
436
  return getIsArbitraryValue(value, '', isShadow);
459
437
  }
438
+ function isAny() {
439
+ return true;
440
+ }
460
441
  function getIsArbitraryValue(value, label, testValue) {
461
- var result = arbitraryValueRegex.exec(value);
442
+ const result = arbitraryValueRegex.exec(value);
462
443
  if (result) {
463
444
  if (result[1]) {
464
- return result[1] === label;
445
+ return typeof label === 'string' ? result[1] === label : label.has(result[1]);
465
446
  }
466
447
  return testValue(result[2]);
467
448
  }
@@ -473,95 +454,64 @@ function isLengthOnly(value) {
473
454
  function isNever() {
474
455
  return false;
475
456
  }
476
- function isUrl(value) {
477
- return value.startsWith('url(');
478
- }
479
- function isIntegerOnly(value) {
480
- return Number.isInteger(Number(value));
481
- }
482
457
  function isShadow(value) {
483
458
  return shadowRegex.test(value);
484
459
  }
485
-
460
+ function isImage(value) {
461
+ return imageRegex.test(value);
462
+ }
486
463
  function getDefaultConfig() {
487
- var colors = fromTheme('colors');
488
- var spacing = fromTheme('spacing');
489
- var blur = fromTheme('blur');
490
- var brightness = fromTheme('brightness');
491
- var borderColor = fromTheme('borderColor');
492
- var borderRadius = fromTheme('borderRadius');
493
- var borderSpacing = fromTheme('borderSpacing');
494
- var borderWidth = fromTheme('borderWidth');
495
- var contrast = fromTheme('contrast');
496
- var grayscale = fromTheme('grayscale');
497
- var hueRotate = fromTheme('hueRotate');
498
- var invert = fromTheme('invert');
499
- var gap = fromTheme('gap');
500
- var gradientColorStops = fromTheme('gradientColorStops');
501
- var gradientColorStopPositions = fromTheme('gradientColorStopPositions');
502
- var inset = fromTheme('inset');
503
- var margin = fromTheme('margin');
504
- var opacity = fromTheme('opacity');
505
- var padding = fromTheme('padding');
506
- var saturate = fromTheme('saturate');
507
- var scale = fromTheme('scale');
508
- var sepia = fromTheme('sepia');
509
- var skew = fromTheme('skew');
510
- var space = fromTheme('space');
511
- var translate = fromTheme('translate');
512
- var getOverscroll = function getOverscroll() {
513
- return ['auto', 'contain', 'none'];
514
- };
515
- var getOverflow = function getOverflow() {
516
- return ['auto', 'hidden', 'clip', 'visible', 'scroll'];
517
- };
518
- var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary() {
519
- return ['auto', isArbitraryValue, spacing];
520
- };
521
- var getSpacingWithArbitrary = function getSpacingWithArbitrary() {
522
- return [isArbitraryValue, spacing];
523
- };
524
- var getLengthWithEmpty = function getLengthWithEmpty() {
525
- return ['', isLength];
526
- };
527
- var getNumberWithAutoAndArbitrary = function getNumberWithAutoAndArbitrary() {
528
- return ['auto', isNumber, isArbitraryValue];
529
- };
530
- var getPositions = function getPositions() {
531
- return ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
532
- };
533
- var getLineStyles = function getLineStyles() {
534
- return ['solid', 'dashed', 'dotted', 'double', 'none'];
535
- };
536
- var getBlendModes = function getBlendModes() {
537
- return ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
538
- };
539
- var getAlign = function getAlign() {
540
- return ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
541
- };
542
- var getZeroAndEmpty = function getZeroAndEmpty() {
543
- return ['', '0', isArbitraryValue];
544
- };
545
- var getBreaks = function getBreaks() {
546
- return ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
547
- };
548
- var getNumber = function getNumber() {
549
- return [isNumber, isArbitraryNumber];
550
- };
551
- var getNumberAndArbitrary = function getNumberAndArbitrary() {
552
- return [isNumber, isArbitraryValue];
553
- };
464
+ const colors = fromTheme('colors');
465
+ const spacing = fromTheme('spacing');
466
+ const blur = fromTheme('blur');
467
+ const brightness = fromTheme('brightness');
468
+ const borderColor = fromTheme('borderColor');
469
+ const borderRadius = fromTheme('borderRadius');
470
+ const borderSpacing = fromTheme('borderSpacing');
471
+ const borderWidth = fromTheme('borderWidth');
472
+ const contrast = fromTheme('contrast');
473
+ const grayscale = fromTheme('grayscale');
474
+ const hueRotate = fromTheme('hueRotate');
475
+ const invert = fromTheme('invert');
476
+ const gap = fromTheme('gap');
477
+ const gradientColorStops = fromTheme('gradientColorStops');
478
+ const gradientColorStopPositions = fromTheme('gradientColorStopPositions');
479
+ const inset = fromTheme('inset');
480
+ const margin = fromTheme('margin');
481
+ const opacity = fromTheme('opacity');
482
+ const padding = fromTheme('padding');
483
+ const saturate = fromTheme('saturate');
484
+ const scale = fromTheme('scale');
485
+ const sepia = fromTheme('sepia');
486
+ const skew = fromTheme('skew');
487
+ const space = fromTheme('space');
488
+ const translate = fromTheme('translate');
489
+ const getOverscroll = () => ['auto', 'contain', 'none'];
490
+ const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
491
+ const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing];
492
+ const getSpacingWithArbitrary = () => [isArbitraryValue, spacing];
493
+ const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength];
494
+ const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue];
495
+ const getPositions = () => ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
496
+ const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'];
497
+ const getBlendModes = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
498
+ const getAlign = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
499
+ const getZeroAndEmpty = () => ['', '0', isArbitraryValue];
500
+ const getBreaks = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
501
+ const getNumber = () => [isNumber, isArbitraryNumber];
502
+ const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
554
503
  return {
555
504
  cacheSize: 500,
505
+ separator: ':',
556
506
  theme: {
557
507
  colors: [isAny],
558
- spacing: [isLength],
508
+ spacing: [isLength, isArbitraryLength],
559
509
  blur: ['none', '', isTshirtSize, isArbitraryValue],
560
510
  brightness: getNumber(),
561
511
  borderColor: [colors],
562
512
  borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
563
513
  borderSpacing: getSpacingWithArbitrary(),
564
- borderWidth: getLengthWithEmpty(),
514
+ borderWidth: getLengthWithEmptyAndArbitrary(),
565
515
  contrast: getNumber(),
566
516
  grayscale: getZeroAndEmpty(),
567
517
  hueRotate: getNumberAndArbitrary(),
@@ -645,8 +595,8 @@ function getDefaultConfig() {
645
595
  * Floats
646
596
  * @see https://tailwindcss.com/docs/float
647
597
  */
648
- "float": [{
649
- "float": ['right', 'left', 'none']
598
+ float: [{
599
+ float: ['right', 'left', 'none']
650
600
  }],
651
601
  /**
652
602
  * Clear
@@ -672,7 +622,7 @@ function getDefaultConfig() {
672
622
  * @see https://tailwindcss.com/docs/object-position
673
623
  */
674
624
  'object-position': [{
675
- object: [].concat(getPositions(), [isArbitraryValue])
625
+ object: [...getPositions(), isArbitraryValue]
676
626
  }],
677
627
  /**
678
628
  * Overflow
@@ -794,7 +744,7 @@ function getDefaultConfig() {
794
744
  * @see https://tailwindcss.com/docs/z-index
795
745
  */
796
746
  z: [{
797
- z: ['auto', isInteger]
747
+ z: ['auto', isInteger, isArbitraryValue]
798
748
  }],
799
749
  // Flexbox and Grid
800
750
  /**
@@ -844,7 +794,7 @@ function getDefaultConfig() {
844
794
  * @see https://tailwindcss.com/docs/order
845
795
  */
846
796
  order: [{
847
- order: ['first', 'last', 'none', isInteger]
797
+ order: ['first', 'last', 'none', isInteger, isArbitraryValue]
848
798
  }],
849
799
  /**
850
800
  * Grid Template Columns
@@ -859,7 +809,7 @@ function getDefaultConfig() {
859
809
  */
860
810
  'col-start-end': [{
861
811
  col: ['auto', {
862
- span: ['full', isInteger]
812
+ span: ['full', isInteger, isArbitraryValue]
863
813
  }, isArbitraryValue]
864
814
  }],
865
815
  /**
@@ -889,7 +839,7 @@ function getDefaultConfig() {
889
839
  */
890
840
  'row-start-end': [{
891
841
  row: ['auto', {
892
- span: [isInteger]
842
+ span: [isInteger, isArbitraryValue]
893
843
  }, isArbitraryValue]
894
844
  }],
895
845
  /**
@@ -953,7 +903,7 @@ function getDefaultConfig() {
953
903
  * @see https://tailwindcss.com/docs/justify-content
954
904
  */
955
905
  'justify-content': [{
956
- justify: ['normal'].concat(getAlign())
906
+ justify: ['normal', ...getAlign()]
957
907
  }],
958
908
  /**
959
909
  * Justify Items
@@ -974,7 +924,7 @@ function getDefaultConfig() {
974
924
  * @see https://tailwindcss.com/docs/align-content
975
925
  */
976
926
  'align-content': [{
977
- content: ['normal'].concat(getAlign(), ['baseline'])
927
+ content: ['normal', ...getAlign(), 'baseline']
978
928
  }],
979
929
  /**
980
930
  * Align Items
@@ -995,7 +945,7 @@ function getDefaultConfig() {
995
945
  * @see https://tailwindcss.com/docs/place-content
996
946
  */
997
947
  'place-content': [{
998
- 'place-content': [].concat(getAlign(), ['baseline'])
948
+ 'place-content': [...getAlign(), 'baseline']
999
949
  }],
1000
950
  /**
1001
951
  * Place Items
@@ -1198,7 +1148,7 @@ function getDefaultConfig() {
1198
1148
  * @see https://tailwindcss.com/docs/min-height
1199
1149
  */
1200
1150
  'min-h': [{
1201
- 'min-h': ['min', 'max', 'fit', isArbitraryValue, isLength]
1151
+ 'min-h': ['min', 'max', 'fit', isLength, isArbitraryValue]
1202
1152
  }],
1203
1153
  /**
1204
1154
  * Max-Height
@@ -1288,7 +1238,7 @@ function getDefaultConfig() {
1288
1238
  * @see https://tailwindcss.com/docs/line-height
1289
1239
  */
1290
1240
  leading: [{
1291
- leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isArbitraryValue, isLength]
1241
+ leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
1292
1242
  }],
1293
1243
  /**
1294
1244
  * List Style Image
@@ -1357,21 +1307,21 @@ function getDefaultConfig() {
1357
1307
  * @see https://tailwindcss.com/docs/text-decoration-style
1358
1308
  */
1359
1309
  'text-decoration-style': [{
1360
- decoration: [].concat(getLineStyles(), ['wavy'])
1310
+ decoration: [...getLineStyles(), 'wavy']
1361
1311
  }],
1362
1312
  /**
1363
1313
  * Text Decoration Thickness
1364
1314
  * @see https://tailwindcss.com/docs/text-decoration-thickness
1365
1315
  */
1366
1316
  'text-decoration-thickness': [{
1367
- decoration: ['auto', 'from-font', isLength]
1317
+ decoration: ['auto', 'from-font', isLength, isArbitraryLength]
1368
1318
  }],
1369
1319
  /**
1370
1320
  * Text Underline Offset
1371
1321
  * @see https://tailwindcss.com/docs/text-underline-offset
1372
1322
  */
1373
1323
  'underline-offset': [{
1374
- 'underline-offset': ['auto', isArbitraryValue, isLength]
1324
+ 'underline-offset': ['auto', isLength, isArbitraryValue]
1375
1325
  }],
1376
1326
  /**
1377
1327
  * Text Decoration Color
@@ -1415,8 +1365,8 @@ function getDefaultConfig() {
1415
1365
  * Word Break
1416
1366
  * @see https://tailwindcss.com/docs/word-break
1417
1367
  */
1418
- "break": [{
1419
- "break": ['normal', 'words', 'all', 'keep']
1368
+ break: [{
1369
+ break: ['normal', 'words', 'all', 'keep']
1420
1370
  }],
1421
1371
  /**
1422
1372
  * Hyphens
@@ -1467,7 +1417,7 @@ function getDefaultConfig() {
1467
1417
  * @see https://tailwindcss.com/docs/background-position
1468
1418
  */
1469
1419
  'bg-position': [{
1470
- bg: [].concat(getPositions(), [isArbitraryPosition])
1420
+ bg: [...getPositions(), isArbitraryPosition]
1471
1421
  }],
1472
1422
  /**
1473
1423
  * Background Repeat
@@ -1492,7 +1442,7 @@ function getDefaultConfig() {
1492
1442
  'bg-image': [{
1493
1443
  bg: ['none', {
1494
1444
  'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
1495
- }, isArbitraryUrl]
1445
+ }, isArbitraryImage]
1496
1446
  }],
1497
1447
  /**
1498
1448
  * Background Color
@@ -1724,7 +1674,7 @@ function getDefaultConfig() {
1724
1674
  * @see https://tailwindcss.com/docs/border-style
1725
1675
  */
1726
1676
  'border-style': [{
1727
- border: [].concat(getLineStyles(), ['hidden'])
1677
+ border: [...getLineStyles(), 'hidden']
1728
1678
  }],
1729
1679
  /**
1730
1680
  * Divide Width X
@@ -1825,21 +1775,21 @@ function getDefaultConfig() {
1825
1775
  * @see https://tailwindcss.com/docs/outline-style
1826
1776
  */
1827
1777
  'outline-style': [{
1828
- outline: [''].concat(getLineStyles())
1778
+ outline: ['', ...getLineStyles()]
1829
1779
  }],
1830
1780
  /**
1831
1781
  * Outline Offset
1832
1782
  * @see https://tailwindcss.com/docs/outline-offset
1833
1783
  */
1834
1784
  'outline-offset': [{
1835
- 'outline-offset': [isArbitraryValue, isLength]
1785
+ 'outline-offset': [isLength, isArbitraryValue]
1836
1786
  }],
1837
1787
  /**
1838
1788
  * Outline Width
1839
1789
  * @see https://tailwindcss.com/docs/outline-width
1840
1790
  */
1841
1791
  'outline-w': [{
1842
- outline: [isLength]
1792
+ outline: [isLength, isArbitraryLength]
1843
1793
  }],
1844
1794
  /**
1845
1795
  * Outline Color
@@ -1853,7 +1803,7 @@ function getDefaultConfig() {
1853
1803
  * @see https://tailwindcss.com/docs/ring-width
1854
1804
  */
1855
1805
  'ring-w': [{
1856
- ring: getLengthWithEmpty()
1806
+ ring: getLengthWithEmptyAndArbitrary()
1857
1807
  }],
1858
1808
  /**
1859
1809
  * Ring Width Inset
@@ -1879,7 +1829,7 @@ function getDefaultConfig() {
1879
1829
  * @see https://tailwindcss.com/docs/ring-offset-width
1880
1830
  */
1881
1831
  'ring-offset-w': [{
1882
- 'ring-offset': [isLength]
1832
+ 'ring-offset': [isLength, isArbitraryLength]
1883
1833
  }],
1884
1834
  /**
1885
1835
  * Ring Offset Color
@@ -2424,10 +2374,27 @@ function getDefaultConfig() {
2424
2374
  * @see https://tailwindcss.com/docs/touch-action
2425
2375
  */
2426
2376
  touch: [{
2427
- touch: ['auto', 'none', 'pinch-zoom', 'manipulation', {
2428
- pan: ['x', 'left', 'right', 'y', 'up', 'down']
2429
- }]
2377
+ touch: ['auto', 'none', 'manipulation']
2378
+ }],
2379
+ /**
2380
+ * Touch Action X
2381
+ * @see https://tailwindcss.com/docs/touch-action
2382
+ */
2383
+ 'touch-x': [{
2384
+ 'touch-pan': ['x', 'left', 'right']
2430
2385
  }],
2386
+ /**
2387
+ * Touch Action Y
2388
+ * @see https://tailwindcss.com/docs/touch-action
2389
+ */
2390
+ 'touch-y': [{
2391
+ 'touch-pan': ['y', 'up', 'down']
2392
+ }],
2393
+ /**
2394
+ * Touch Action Pinch Zoom
2395
+ * @see https://tailwindcss.com/docs/touch-action
2396
+ */
2397
+ 'touch-pz': ['touch-pinch-zoom'],
2431
2398
  /**
2432
2399
  * User Select
2433
2400
  * @see https://tailwindcss.com/docs/user-select
@@ -2455,7 +2422,7 @@ function getDefaultConfig() {
2455
2422
  * @see https://tailwindcss.com/docs/stroke-width
2456
2423
  */
2457
2424
  'stroke-w': [{
2458
- stroke: [isLength, isArbitraryNumber]
2425
+ stroke: [isLength, isArbitraryLength, isArbitraryNumber]
2459
2426
  }],
2460
2427
  /**
2461
2428
  * Stroke
@@ -2511,7 +2478,11 @@ function getDefaultConfig() {
2511
2478
  'scroll-my': ['scroll-mt', 'scroll-mb'],
2512
2479
  'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
2513
2480
  'scroll-px': ['scroll-pr', 'scroll-pl'],
2514
- 'scroll-py': ['scroll-pt', 'scroll-pb']
2481
+ 'scroll-py': ['scroll-pt', 'scroll-pb'],
2482
+ touch: ['touch-x', 'touch-y', 'touch-pz'],
2483
+ 'touch-x': ['touch'],
2484
+ 'touch-y': ['touch'],
2485
+ 'touch-pz': ['touch']
2515
2486
  },
2516
2487
  conflictingClassGroupModifiers: {
2517
2488
  'font-size': ['leading']
@@ -2519,12 +2490,75 @@ function getDefaultConfig() {
2519
2490
  };
2520
2491
  }
2521
2492
 
2522
- var twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
2493
+ /**
2494
+ * @param baseConfig Config where other config will be merged into. This object will be mutated.
2495
+ * @param configExtension Partial config to merge into the `baseConfig`.
2496
+ */
2497
+ function mergeConfigs(baseConfig, {
2498
+ cacheSize,
2499
+ prefix,
2500
+ separator,
2501
+ extend = {},
2502
+ override = {}
2503
+ }) {
2504
+ overrideProperty(baseConfig, 'cacheSize', cacheSize);
2505
+ overrideProperty(baseConfig, 'prefix', prefix);
2506
+ overrideProperty(baseConfig, 'separator', separator);
2507
+ for (const configKey in override) {
2508
+ overrideConfigProperties(baseConfig[configKey], override[configKey]);
2509
+ }
2510
+ for (const key in extend) {
2511
+ mergeConfigProperties(baseConfig[key], extend[key]);
2512
+ }
2513
+ return baseConfig;
2514
+ }
2515
+ function overrideProperty(baseObject, overrideKey, overrideValue) {
2516
+ if (overrideValue !== undefined) {
2517
+ baseObject[overrideKey] = overrideValue;
2518
+ }
2519
+ }
2520
+ function overrideConfigProperties(baseObject, overrideObject) {
2521
+ if (overrideObject) {
2522
+ for (const key in overrideObject) {
2523
+ overrideProperty(baseObject, key, overrideObject[key]);
2524
+ }
2525
+ }
2526
+ }
2527
+ function mergeConfigProperties(baseObject, mergeObject) {
2528
+ if (mergeObject) {
2529
+ for (const key in mergeObject) {
2530
+ const mergeValue = mergeObject[key];
2531
+ if (mergeValue !== undefined) {
2532
+ baseObject[key] = (baseObject[key] || []).concat(mergeValue);
2533
+ }
2534
+ }
2535
+ }
2536
+ }
2537
+ function extendTailwindMerge(configExtension, ...createConfig) {
2538
+ return typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
2539
+ }
2523
2540
 
2524
2541
  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))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
2525
2542
 
2543
+ const customTwMerge = extendTailwindMerge({
2544
+ classGroups: {
2545
+ shadow: Object.keys(tailwindConfig.boxShadows).map((s) => `shadow-${s}`),
2546
+ "font-size": Object.keys(tailwindConfig.fontSizes).map((s) => `text-${s}`),
2547
+ "font-weight": Object.keys(tailwindConfig.fontWeights).map((s) => `font-${s}`),
2548
+ "line-height": Object.keys(tailwindConfig.lineHeights).map((s) => `leading-${s}`),
2549
+ scale: Object.keys(tailwindConfig.scales).map((s) => `scale-${s}`),
2550
+ height: Object.keys(tailwindConfig.heights).map((s) => `h-${s}`),
2551
+ borderRadius: Object.keys(tailwindConfig.borderRadius).map((s) => `rounded-${s}`),
2552
+ colors: Object.entries(tailwindConfig.colorPalette).reduce((acc, currentVal) => {
2553
+ const colors = Object.keys(currentVal[1]).map(
2554
+ (c) => `text-${currentVal[0]}-${c}`
2555
+ );
2556
+ return [...acc, ...colors];
2557
+ }, [])
2558
+ }
2559
+ });
2526
2560
  const cn = (...inputs) => {
2527
- return twMerge(clsx(inputs));
2561
+ return customTwMerge(clsx(inputs));
2528
2562
  };
2529
2563
 
2530
2564
  exports.cn = cn;