@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.js CHANGED
@@ -1,52 +1,14 @@
1
- /**
2
- * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
3
- *
4
- * Specifically:
5
- * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
6
- * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
7
- *
8
- * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
9
- */
10
- function twJoin() {
11
- var index = 0;
12
- var argument;
13
- var resolvedValue;
14
- var string = '';
15
- while (index < arguments.length) {
16
- if (argument = arguments[index++]) {
17
- if (resolvedValue = toValue(argument)) {
18
- string && (string += ' ');
19
- string += resolvedValue;
20
- }
21
- }
22
- }
23
- return string;
24
- }
25
- function toValue(mix) {
26
- if (typeof mix === 'string') {
27
- return mix;
28
- }
29
- var resolvedValue;
30
- var string = '';
31
- for (var k = 0; k < mix.length; k++) {
32
- if (mix[k]) {
33
- if (resolvedValue = toValue(mix[k])) {
34
- string && (string += ' ');
35
- string += resolvedValue;
36
- }
37
- }
38
- }
39
- return string;
40
- }
1
+ import { b as boxShadows, f as fontSizes, a as fontWeights, l as lineHeights, s as scales, h as heights, c as borderRadius, d as colorPalette } from './tailwind-config-0df99c97.js';
41
2
 
42
- var CLASS_PART_SEPARATOR = '-';
3
+ const CLASS_PART_SEPARATOR = '-';
43
4
  function createClassUtils(config) {
44
- var classMap = createClassMap(config);
45
- var conflictingClassGroups = config.conflictingClassGroups,
46
- _config$conflictingCl = config.conflictingClassGroupModifiers,
47
- conflictingClassGroupModifiers = _config$conflictingCl === void 0 ? {} : _config$conflictingCl;
5
+ const classMap = createClassMap(config);
6
+ const {
7
+ conflictingClassGroups,
8
+ conflictingClassGroupModifiers
9
+ } = config;
48
10
  function getClassGroupId(className) {
49
- var classParts = className.split(CLASS_PART_SEPARATOR);
11
+ const classParts = className.split(CLASS_PART_SEPARATOR);
50
12
  // 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.
51
13
  if (classParts[0] === '' && classParts.length !== 1) {
52
14
  classParts.shift();
@@ -54,41 +16,40 @@ function createClassUtils(config) {
54
16
  return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
55
17
  }
56
18
  function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
57
- var conflicts = conflictingClassGroups[classGroupId] || [];
19
+ const conflicts = conflictingClassGroups[classGroupId] || [];
58
20
  if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
59
- return [].concat(conflicts, conflictingClassGroupModifiers[classGroupId]);
21
+ return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
60
22
  }
61
23
  return conflicts;
62
24
  }
63
25
  return {
64
- getClassGroupId: getClassGroupId,
65
- getConflictingClassGroupIds: getConflictingClassGroupIds
26
+ getClassGroupId,
27
+ getConflictingClassGroupIds
66
28
  };
67
29
  }
68
30
  function getGroupRecursive(classParts, classPartObject) {
69
31
  if (classParts.length === 0) {
70
32
  return classPartObject.classGroupId;
71
33
  }
72
- var currentClassPart = classParts[0];
73
- var nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
74
- var classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
34
+ const currentClassPart = classParts[0];
35
+ const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
36
+ const classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
75
37
  if (classGroupFromNextClassPart) {
76
38
  return classGroupFromNextClassPart;
77
39
  }
78
40
  if (classPartObject.validators.length === 0) {
79
41
  return undefined;
80
42
  }
81
- var classRest = classParts.join(CLASS_PART_SEPARATOR);
82
- return classPartObject.validators.find(function (_ref) {
83
- var validator = _ref.validator;
84
- return validator(classRest);
85
- })?.classGroupId;
43
+ const classRest = classParts.join(CLASS_PART_SEPARATOR);
44
+ return classPartObject.validators.find(({
45
+ validator
46
+ }) => validator(classRest))?.classGroupId;
86
47
  }
87
- var arbitraryPropertyRegex = /^\[(.+)\]$/;
48
+ const arbitraryPropertyRegex = /^\[(.+)\]$/;
88
49
  function getGroupIdForArbitraryProperty(className) {
89
50
  if (arbitraryPropertyRegex.test(className)) {
90
- var arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
91
- var property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
51
+ const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
52
+ const property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
92
53
  if (property) {
93
54
  // I use two dots here because one dot is used as prefix for class groups in plugins
94
55
  return 'arbitrary..' + property;
@@ -99,24 +60,24 @@ function getGroupIdForArbitraryProperty(className) {
99
60
  * Exported for testing only
100
61
  */
101
62
  function createClassMap(config) {
102
- var theme = config.theme,
103
- prefix = config.prefix;
104
- var classMap = {
63
+ const {
64
+ theme,
65
+ prefix
66
+ } = config;
67
+ const classMap = {
105
68
  nextPart: new Map(),
106
69
  validators: []
107
70
  };
108
- var prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
109
- prefixedClassGroupEntries.forEach(function (_ref2) {
110
- var classGroupId = _ref2[0],
111
- classGroup = _ref2[1];
71
+ const prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
72
+ prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
112
73
  processClassesRecursively(classGroup, classMap, classGroupId, theme);
113
74
  });
114
75
  return classMap;
115
76
  }
116
77
  function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
117
- classGroup.forEach(function (classDefinition) {
78
+ classGroup.forEach(classDefinition => {
118
79
  if (typeof classDefinition === 'string') {
119
- var classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
80
+ const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
120
81
  classPartObjectToEdit.classGroupId = classGroupId;
121
82
  return;
122
83
  }
@@ -127,20 +88,18 @@ function processClassesRecursively(classGroup, classPartObject, classGroupId, th
127
88
  }
128
89
  classPartObject.validators.push({
129
90
  validator: classDefinition,
130
- classGroupId: classGroupId
91
+ classGroupId
131
92
  });
132
93
  return;
133
94
  }
134
- Object.entries(classDefinition).forEach(function (_ref3) {
135
- var key = _ref3[0],
136
- classGroup = _ref3[1];
95
+ Object.entries(classDefinition).forEach(([key, classGroup]) => {
137
96
  processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
138
97
  });
139
98
  });
140
99
  }
141
100
  function getPart(classPartObject, path) {
142
- var currentClassPartObject = classPartObject;
143
- path.split(CLASS_PART_SEPARATOR).forEach(function (pathPart) {
101
+ let currentClassPartObject = classPartObject;
102
+ path.split(CLASS_PART_SEPARATOR).forEach(pathPart => {
144
103
  if (!currentClassPartObject.nextPart.has(pathPart)) {
145
104
  currentClassPartObject.nextPart.set(pathPart, {
146
105
  nextPart: new Map(),
@@ -158,19 +117,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
158
117
  if (!prefix) {
159
118
  return classGroupEntries;
160
119
  }
161
- return classGroupEntries.map(function (_ref4) {
162
- var classGroupId = _ref4[0],
163
- classGroup = _ref4[1];
164
- var prefixedClassGroup = classGroup.map(function (classDefinition) {
120
+ return classGroupEntries.map(([classGroupId, classGroup]) => {
121
+ const prefixedClassGroup = classGroup.map(classDefinition => {
165
122
  if (typeof classDefinition === 'string') {
166
123
  return prefix + classDefinition;
167
124
  }
168
125
  if (typeof classDefinition === 'object') {
169
- return Object.fromEntries(Object.entries(classDefinition).map(function (_ref5) {
170
- var key = _ref5[0],
171
- value = _ref5[1];
172
- return [prefix + key, value];
173
- }));
126
+ return Object.fromEntries(Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]));
174
127
  }
175
128
  return classDefinition;
176
129
  });
@@ -182,15 +135,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
182
135
  function createLruCache(maxCacheSize) {
183
136
  if (maxCacheSize < 1) {
184
137
  return {
185
- get: function get() {
186
- return undefined;
187
- },
188
- set: function set() {}
138
+ get: () => undefined,
139
+ set: () => {}
189
140
  };
190
141
  }
191
- var cacheSize = 0;
192
- var cache = new Map();
193
- var previousCache = new Map();
142
+ let cacheSize = 0;
143
+ let cache = new Map();
144
+ let previousCache = new Map();
194
145
  function update(key, value) {
195
146
  cache.set(key, value);
196
147
  cacheSize++;
@@ -201,8 +152,8 @@ function createLruCache(maxCacheSize) {
201
152
  }
202
153
  }
203
154
  return {
204
- get: function get(key) {
205
- var value = cache.get(key);
155
+ get(key) {
156
+ let value = cache.get(key);
206
157
  if (value !== undefined) {
207
158
  return value;
208
159
  }
@@ -211,7 +162,7 @@ function createLruCache(maxCacheSize) {
211
162
  return value;
212
163
  }
213
164
  },
214
- set: function set(key, value) {
165
+ set(key, value) {
215
166
  if (cache.has(key)) {
216
167
  cache.set(key, value);
217
168
  } else {
@@ -220,21 +171,20 @@ function createLruCache(maxCacheSize) {
220
171
  }
221
172
  };
222
173
  }
223
-
224
- var IMPORTANT_MODIFIER = '!';
174
+ const IMPORTANT_MODIFIER = '!';
225
175
  function createSplitModifiers(config) {
226
- var separator = config.separator || ':';
227
- var isSeparatorSingleCharacter = separator.length === 1;
228
- var firstSeparatorCharacter = separator[0];
229
- var separatorLength = separator.length;
176
+ const separator = config.separator;
177
+ const isSeparatorSingleCharacter = separator.length === 1;
178
+ const firstSeparatorCharacter = separator[0];
179
+ const separatorLength = separator.length;
230
180
  // splitModifiers inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
231
181
  return function splitModifiers(className) {
232
- var modifiers = [];
233
- var bracketDepth = 0;
234
- var modifierStart = 0;
235
- var postfixModifierPosition;
236
- for (var index = 0; index < className.length; index++) {
237
- var currentCharacter = className[index];
182
+ const modifiers = [];
183
+ let bracketDepth = 0;
184
+ let modifierStart = 0;
185
+ let postfixModifierPosition;
186
+ for (let index = 0; index < className.length; index++) {
187
+ let currentCharacter = className[index];
238
188
  if (bracketDepth === 0) {
239
189
  if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
240
190
  modifiers.push(className.slice(modifierStart, index));
@@ -252,15 +202,15 @@ function createSplitModifiers(config) {
252
202
  bracketDepth--;
253
203
  }
254
204
  }
255
- var baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
256
- var hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
257
- var baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
258
- var maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
205
+ const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
206
+ const hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
207
+ const baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
208
+ const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
259
209
  return {
260
- modifiers: modifiers,
261
- hasImportantModifier: hasImportantModifier,
262
- baseClassName: baseClassName,
263
- maybePostfixModifierPosition: maybePostfixModifierPosition
210
+ modifiers,
211
+ hasImportantModifier,
212
+ baseClassName,
213
+ maybePostfixModifierPosition
264
214
  };
265
215
  };
266
216
  }
@@ -273,21 +223,20 @@ function sortModifiers(modifiers) {
273
223
  if (modifiers.length <= 1) {
274
224
  return modifiers;
275
225
  }
276
- var sortedModifiers = [];
277
- var unsortedModifiers = [];
278
- modifiers.forEach(function (modifier) {
279
- var isArbitraryVariant = modifier[0] === '[';
226
+ const sortedModifiers = [];
227
+ let unsortedModifiers = [];
228
+ modifiers.forEach(modifier => {
229
+ const isArbitraryVariant = modifier[0] === '[';
280
230
  if (isArbitraryVariant) {
281
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort().concat([modifier]));
231
+ sortedModifiers.push(...unsortedModifiers.sort(), modifier);
282
232
  unsortedModifiers = [];
283
233
  } else {
284
234
  unsortedModifiers.push(modifier);
285
235
  }
286
236
  });
287
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort());
237
+ sortedModifiers.push(...unsortedModifiers.sort());
288
238
  return sortedModifiers;
289
239
  }
290
-
291
240
  function createConfigUtils(config) {
292
241
  return {
293
242
  cache: createLruCache(config.cacheSize),
@@ -295,12 +244,13 @@ function createConfigUtils(config) {
295
244
  ...createClassUtils(config)
296
245
  };
297
246
  }
298
-
299
- var SPLIT_CLASSES_REGEX = /\s+/;
247
+ const SPLIT_CLASSES_REGEX = /\s+/;
300
248
  function mergeClassList(classList, configUtils) {
301
- var splitModifiers = configUtils.splitModifiers,
302
- getClassGroupId = configUtils.getClassGroupId,
303
- getConflictingClassGroupIds = configUtils.getConflictingClassGroupIds;
249
+ const {
250
+ splitModifiers,
251
+ getClassGroupId,
252
+ getConflictingClassGroupIds
253
+ } = configUtils;
304
254
  /**
305
255
  * Set of classGroupIds in following format:
306
256
  * `{importantModifier}{variantModifiers}{classGroupId}`
@@ -308,77 +258,109 @@ function mergeClassList(classList, configUtils) {
308
258
  * @example 'hover:focus:bg-color'
309
259
  * @example 'md:!pr'
310
260
  */
311
- var classGroupsInConflict = new Set();
312
- return classList.trim().split(SPLIT_CLASSES_REGEX).map(function (originalClassName) {
313
- var _splitModifiers = splitModifiers(originalClassName),
314
- modifiers = _splitModifiers.modifiers,
315
- hasImportantModifier = _splitModifiers.hasImportantModifier,
316
- baseClassName = _splitModifiers.baseClassName,
317
- maybePostfixModifierPosition = _splitModifiers.maybePostfixModifierPosition;
318
- var classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
319
- var hasPostfixModifier = Boolean(maybePostfixModifierPosition);
261
+ const classGroupsInConflict = new Set();
262
+ return classList.trim().split(SPLIT_CLASSES_REGEX).map(originalClassName => {
263
+ const {
264
+ modifiers,
265
+ hasImportantModifier,
266
+ baseClassName,
267
+ maybePostfixModifierPosition
268
+ } = splitModifiers(originalClassName);
269
+ let classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
270
+ let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
320
271
  if (!classGroupId) {
321
272
  if (!maybePostfixModifierPosition) {
322
273
  return {
323
274
  isTailwindClass: false,
324
- originalClassName: originalClassName
275
+ originalClassName
325
276
  };
326
277
  }
327
278
  classGroupId = getClassGroupId(baseClassName);
328
279
  if (!classGroupId) {
329
280
  return {
330
281
  isTailwindClass: false,
331
- originalClassName: originalClassName
282
+ originalClassName
332
283
  };
333
284
  }
334
285
  hasPostfixModifier = false;
335
286
  }
336
- var variantModifier = sortModifiers(modifiers).join(':');
337
- var modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
287
+ const variantModifier = sortModifiers(modifiers).join(':');
288
+ const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
338
289
  return {
339
290
  isTailwindClass: true,
340
- modifierId: modifierId,
341
- classGroupId: classGroupId,
342
- originalClassName: originalClassName,
343
- hasPostfixModifier: hasPostfixModifier
291
+ modifierId,
292
+ classGroupId,
293
+ originalClassName,
294
+ hasPostfixModifier
344
295
  };
345
296
  }).reverse()
346
297
  // Last class in conflict wins, so we need to filter conflicting classes in reverse order.
347
- .filter(function (parsed) {
298
+ .filter(parsed => {
348
299
  if (!parsed.isTailwindClass) {
349
300
  return true;
350
301
  }
351
- var modifierId = parsed.modifierId,
352
- classGroupId = parsed.classGroupId,
353
- hasPostfixModifier = parsed.hasPostfixModifier;
354
- var classId = modifierId + classGroupId;
302
+ const {
303
+ modifierId,
304
+ classGroupId,
305
+ hasPostfixModifier
306
+ } = parsed;
307
+ const classId = modifierId + classGroupId;
355
308
  if (classGroupsInConflict.has(classId)) {
356
309
  return false;
357
310
  }
358
311
  classGroupsInConflict.add(classId);
359
- getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(function (group) {
360
- return classGroupsInConflict.add(modifierId + group);
361
- });
312
+ getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(group => classGroupsInConflict.add(modifierId + group));
362
313
  return true;
363
- }).reverse().map(function (parsed) {
364
- return parsed.originalClassName;
365
- }).join(' ');
314
+ }).reverse().map(parsed => parsed.originalClassName).join(' ');
366
315
  }
367
316
 
368
- function createTailwindMerge() {
369
- for (var _len = arguments.length, createConfig = new Array(_len), _key = 0; _key < _len; _key++) {
370
- createConfig[_key] = arguments[_key];
317
+ /**
318
+ * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
319
+ *
320
+ * Specifically:
321
+ * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
322
+ * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
323
+ *
324
+ * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
325
+ */
326
+ function twJoin() {
327
+ let index = 0;
328
+ let argument;
329
+ let resolvedValue;
330
+ let string = '';
331
+ while (index < arguments.length) {
332
+ if (argument = arguments[index++]) {
333
+ if (resolvedValue = toValue(argument)) {
334
+ string && (string += ' ');
335
+ string += resolvedValue;
336
+ }
337
+ }
371
338
  }
372
- var configUtils;
373
- var cacheGet;
374
- var cacheSet;
375
- var functionToCall = initTailwindMerge;
339
+ return string;
340
+ }
341
+ function toValue(mix) {
342
+ if (typeof mix === 'string') {
343
+ return mix;
344
+ }
345
+ let resolvedValue;
346
+ let string = '';
347
+ for (let k = 0; k < mix.length; k++) {
348
+ if (mix[k]) {
349
+ if (resolvedValue = toValue(mix[k])) {
350
+ string && (string += ' ');
351
+ string += resolvedValue;
352
+ }
353
+ }
354
+ }
355
+ return string;
356
+ }
357
+ function createTailwindMerge(createConfigFirst, ...createConfigRest) {
358
+ let configUtils;
359
+ let cacheGet;
360
+ let cacheSet;
361
+ let functionToCall = initTailwindMerge;
376
362
  function initTailwindMerge(classList) {
377
- var firstCreateConfig = createConfig[0],
378
- restCreateConfig = createConfig.slice(1);
379
- var config = restCreateConfig.reduce(function (previousConfig, createConfigCurrent) {
380
- return createConfigCurrent(previousConfig);
381
- }, firstCreateConfig());
363
+ const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
382
364
  configUtils = createConfigUtils(config);
383
365
  cacheGet = configUtils.cache.get;
384
366
  cacheSet = configUtils.cache.set;
@@ -386,11 +368,11 @@ function createTailwindMerge() {
386
368
  return tailwindMerge(classList);
387
369
  }
388
370
  function tailwindMerge(classList) {
389
- var cachedResult = cacheGet(classList);
371
+ const cachedResult = cacheGet(classList);
390
372
  if (cachedResult) {
391
373
  return cachedResult;
392
374
  }
393
- var result = mergeClassList(classList, configUtils);
375
+ const result = mergeClassList(classList, configUtils);
394
376
  cacheSet(classList, result);
395
377
  return result;
396
378
  }
@@ -398,66 +380,65 @@ function createTailwindMerge() {
398
380
  return functionToCall(twJoin.apply(null, arguments));
399
381
  };
400
382
  }
401
-
402
383
  function fromTheme(key) {
403
- var themeGetter = function themeGetter(theme) {
404
- return theme[key] || [];
405
- };
384
+ const themeGetter = theme => theme[key] || [];
406
385
  themeGetter.isThemeGetter = true;
407
386
  return themeGetter;
408
387
  }
409
-
410
- var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
411
- var fractionRegex = /^\d+\/\d+$/;
412
- var stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
413
- var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
414
- 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$/;
388
+ const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
389
+ const fractionRegex = /^\d+\/\d+$/;
390
+ const stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
391
+ const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
392
+ 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$/;
415
393
  // Shadow always begins with x and y offset separated by underscore
416
- var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
394
+ const shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
395
+ const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
417
396
  function isLength(value) {
418
- return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value) || isArbitraryLength(value);
397
+ return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
419
398
  }
420
399
  function isArbitraryLength(value) {
421
400
  return getIsArbitraryValue(value, 'length', isLengthOnly);
422
401
  }
423
- function isArbitrarySize(value) {
424
- return getIsArbitraryValue(value, 'size', isNever);
425
- }
426
- function isArbitraryPosition(value) {
427
- return getIsArbitraryValue(value, 'position', isNever);
428
- }
429
- function isArbitraryUrl(value) {
430
- return getIsArbitraryValue(value, 'url', isUrl);
402
+ function isNumber(value) {
403
+ return Boolean(value) && !Number.isNaN(Number(value));
431
404
  }
432
405
  function isArbitraryNumber(value) {
433
406
  return getIsArbitraryValue(value, 'number', isNumber);
434
407
  }
435
- function isNumber(value) {
436
- return !Number.isNaN(Number(value));
408
+ function isInteger(value) {
409
+ return Boolean(value) && Number.isInteger(Number(value));
437
410
  }
438
411
  function isPercent(value) {
439
412
  return value.endsWith('%') && isNumber(value.slice(0, -1));
440
413
  }
441
- function isInteger(value) {
442
- return isIntegerOnly(value) || getIsArbitraryValue(value, 'number', isIntegerOnly);
443
- }
444
414
  function isArbitraryValue(value) {
445
415
  return arbitraryValueRegex.test(value);
446
416
  }
447
- function isAny() {
448
- return true;
449
- }
450
417
  function isTshirtSize(value) {
451
418
  return tshirtUnitRegex.test(value);
452
419
  }
420
+ const sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
421
+ function isArbitrarySize(value) {
422
+ return getIsArbitraryValue(value, sizeLabels, isNever);
423
+ }
424
+ function isArbitraryPosition(value) {
425
+ return getIsArbitraryValue(value, 'position', isNever);
426
+ }
427
+ const imageLabels = /*#__PURE__*/new Set(['image', 'url']);
428
+ function isArbitraryImage(value) {
429
+ return getIsArbitraryValue(value, imageLabels, isImage);
430
+ }
453
431
  function isArbitraryShadow(value) {
454
432
  return getIsArbitraryValue(value, '', isShadow);
455
433
  }
434
+ function isAny() {
435
+ return true;
436
+ }
456
437
  function getIsArbitraryValue(value, label, testValue) {
457
- var result = arbitraryValueRegex.exec(value);
438
+ const result = arbitraryValueRegex.exec(value);
458
439
  if (result) {
459
440
  if (result[1]) {
460
- return result[1] === label;
441
+ return typeof label === 'string' ? result[1] === label : label.has(result[1]);
461
442
  }
462
443
  return testValue(result[2]);
463
444
  }
@@ -469,95 +450,64 @@ function isLengthOnly(value) {
469
450
  function isNever() {
470
451
  return false;
471
452
  }
472
- function isUrl(value) {
473
- return value.startsWith('url(');
474
- }
475
- function isIntegerOnly(value) {
476
- return Number.isInteger(Number(value));
477
- }
478
453
  function isShadow(value) {
479
454
  return shadowRegex.test(value);
480
455
  }
481
-
456
+ function isImage(value) {
457
+ return imageRegex.test(value);
458
+ }
482
459
  function getDefaultConfig() {
483
- var colors = fromTheme('colors');
484
- var spacing = fromTheme('spacing');
485
- var blur = fromTheme('blur');
486
- var brightness = fromTheme('brightness');
487
- var borderColor = fromTheme('borderColor');
488
- var borderRadius = fromTheme('borderRadius');
489
- var borderSpacing = fromTheme('borderSpacing');
490
- var borderWidth = fromTheme('borderWidth');
491
- var contrast = fromTheme('contrast');
492
- var grayscale = fromTheme('grayscale');
493
- var hueRotate = fromTheme('hueRotate');
494
- var invert = fromTheme('invert');
495
- var gap = fromTheme('gap');
496
- var gradientColorStops = fromTheme('gradientColorStops');
497
- var gradientColorStopPositions = fromTheme('gradientColorStopPositions');
498
- var inset = fromTheme('inset');
499
- var margin = fromTheme('margin');
500
- var opacity = fromTheme('opacity');
501
- var padding = fromTheme('padding');
502
- var saturate = fromTheme('saturate');
503
- var scale = fromTheme('scale');
504
- var sepia = fromTheme('sepia');
505
- var skew = fromTheme('skew');
506
- var space = fromTheme('space');
507
- var translate = fromTheme('translate');
508
- var getOverscroll = function getOverscroll() {
509
- return ['auto', 'contain', 'none'];
510
- };
511
- var getOverflow = function getOverflow() {
512
- return ['auto', 'hidden', 'clip', 'visible', 'scroll'];
513
- };
514
- var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary() {
515
- return ['auto', isArbitraryValue, spacing];
516
- };
517
- var getSpacingWithArbitrary = function getSpacingWithArbitrary() {
518
- return [isArbitraryValue, spacing];
519
- };
520
- var getLengthWithEmpty = function getLengthWithEmpty() {
521
- return ['', isLength];
522
- };
523
- var getNumberWithAutoAndArbitrary = function getNumberWithAutoAndArbitrary() {
524
- return ['auto', isNumber, isArbitraryValue];
525
- };
526
- var getPositions = function getPositions() {
527
- return ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
528
- };
529
- var getLineStyles = function getLineStyles() {
530
- return ['solid', 'dashed', 'dotted', 'double', 'none'];
531
- };
532
- var getBlendModes = function getBlendModes() {
533
- return ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
534
- };
535
- var getAlign = function getAlign() {
536
- return ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
537
- };
538
- var getZeroAndEmpty = function getZeroAndEmpty() {
539
- return ['', '0', isArbitraryValue];
540
- };
541
- var getBreaks = function getBreaks() {
542
- return ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
543
- };
544
- var getNumber = function getNumber() {
545
- return [isNumber, isArbitraryNumber];
546
- };
547
- var getNumberAndArbitrary = function getNumberAndArbitrary() {
548
- return [isNumber, isArbitraryValue];
549
- };
460
+ const colors = fromTheme('colors');
461
+ const spacing = fromTheme('spacing');
462
+ const blur = fromTheme('blur');
463
+ const brightness = fromTheme('brightness');
464
+ const borderColor = fromTheme('borderColor');
465
+ const borderRadius = fromTheme('borderRadius');
466
+ const borderSpacing = fromTheme('borderSpacing');
467
+ const borderWidth = fromTheme('borderWidth');
468
+ const contrast = fromTheme('contrast');
469
+ const grayscale = fromTheme('grayscale');
470
+ const hueRotate = fromTheme('hueRotate');
471
+ const invert = fromTheme('invert');
472
+ const gap = fromTheme('gap');
473
+ const gradientColorStops = fromTheme('gradientColorStops');
474
+ const gradientColorStopPositions = fromTheme('gradientColorStopPositions');
475
+ const inset = fromTheme('inset');
476
+ const margin = fromTheme('margin');
477
+ const opacity = fromTheme('opacity');
478
+ const padding = fromTheme('padding');
479
+ const saturate = fromTheme('saturate');
480
+ const scale = fromTheme('scale');
481
+ const sepia = fromTheme('sepia');
482
+ const skew = fromTheme('skew');
483
+ const space = fromTheme('space');
484
+ const translate = fromTheme('translate');
485
+ const getOverscroll = () => ['auto', 'contain', 'none'];
486
+ const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
487
+ const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing];
488
+ const getSpacingWithArbitrary = () => [isArbitraryValue, spacing];
489
+ const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength];
490
+ const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue];
491
+ const getPositions = () => ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
492
+ const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'];
493
+ const getBlendModes = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
494
+ const getAlign = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
495
+ const getZeroAndEmpty = () => ['', '0', isArbitraryValue];
496
+ const getBreaks = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
497
+ const getNumber = () => [isNumber, isArbitraryNumber];
498
+ const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
550
499
  return {
551
500
  cacheSize: 500,
501
+ separator: ':',
552
502
  theme: {
553
503
  colors: [isAny],
554
- spacing: [isLength],
504
+ spacing: [isLength, isArbitraryLength],
555
505
  blur: ['none', '', isTshirtSize, isArbitraryValue],
556
506
  brightness: getNumber(),
557
507
  borderColor: [colors],
558
508
  borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
559
509
  borderSpacing: getSpacingWithArbitrary(),
560
- borderWidth: getLengthWithEmpty(),
510
+ borderWidth: getLengthWithEmptyAndArbitrary(),
561
511
  contrast: getNumber(),
562
512
  grayscale: getZeroAndEmpty(),
563
513
  hueRotate: getNumberAndArbitrary(),
@@ -641,8 +591,8 @@ function getDefaultConfig() {
641
591
  * Floats
642
592
  * @see https://tailwindcss.com/docs/float
643
593
  */
644
- "float": [{
645
- "float": ['right', 'left', 'none']
594
+ float: [{
595
+ float: ['right', 'left', 'none']
646
596
  }],
647
597
  /**
648
598
  * Clear
@@ -668,7 +618,7 @@ function getDefaultConfig() {
668
618
  * @see https://tailwindcss.com/docs/object-position
669
619
  */
670
620
  'object-position': [{
671
- object: [].concat(getPositions(), [isArbitraryValue])
621
+ object: [...getPositions(), isArbitraryValue]
672
622
  }],
673
623
  /**
674
624
  * Overflow
@@ -790,7 +740,7 @@ function getDefaultConfig() {
790
740
  * @see https://tailwindcss.com/docs/z-index
791
741
  */
792
742
  z: [{
793
- z: ['auto', isInteger]
743
+ z: ['auto', isInteger, isArbitraryValue]
794
744
  }],
795
745
  // Flexbox and Grid
796
746
  /**
@@ -840,7 +790,7 @@ function getDefaultConfig() {
840
790
  * @see https://tailwindcss.com/docs/order
841
791
  */
842
792
  order: [{
843
- order: ['first', 'last', 'none', isInteger]
793
+ order: ['first', 'last', 'none', isInteger, isArbitraryValue]
844
794
  }],
845
795
  /**
846
796
  * Grid Template Columns
@@ -855,7 +805,7 @@ function getDefaultConfig() {
855
805
  */
856
806
  'col-start-end': [{
857
807
  col: ['auto', {
858
- span: ['full', isInteger]
808
+ span: ['full', isInteger, isArbitraryValue]
859
809
  }, isArbitraryValue]
860
810
  }],
861
811
  /**
@@ -885,7 +835,7 @@ function getDefaultConfig() {
885
835
  */
886
836
  'row-start-end': [{
887
837
  row: ['auto', {
888
- span: [isInteger]
838
+ span: [isInteger, isArbitraryValue]
889
839
  }, isArbitraryValue]
890
840
  }],
891
841
  /**
@@ -949,7 +899,7 @@ function getDefaultConfig() {
949
899
  * @see https://tailwindcss.com/docs/justify-content
950
900
  */
951
901
  'justify-content': [{
952
- justify: ['normal'].concat(getAlign())
902
+ justify: ['normal', ...getAlign()]
953
903
  }],
954
904
  /**
955
905
  * Justify Items
@@ -970,7 +920,7 @@ function getDefaultConfig() {
970
920
  * @see https://tailwindcss.com/docs/align-content
971
921
  */
972
922
  'align-content': [{
973
- content: ['normal'].concat(getAlign(), ['baseline'])
923
+ content: ['normal', ...getAlign(), 'baseline']
974
924
  }],
975
925
  /**
976
926
  * Align Items
@@ -991,7 +941,7 @@ function getDefaultConfig() {
991
941
  * @see https://tailwindcss.com/docs/place-content
992
942
  */
993
943
  'place-content': [{
994
- 'place-content': [].concat(getAlign(), ['baseline'])
944
+ 'place-content': [...getAlign(), 'baseline']
995
945
  }],
996
946
  /**
997
947
  * Place Items
@@ -1194,7 +1144,7 @@ function getDefaultConfig() {
1194
1144
  * @see https://tailwindcss.com/docs/min-height
1195
1145
  */
1196
1146
  'min-h': [{
1197
- 'min-h': ['min', 'max', 'fit', isArbitraryValue, isLength]
1147
+ 'min-h': ['min', 'max', 'fit', isLength, isArbitraryValue]
1198
1148
  }],
1199
1149
  /**
1200
1150
  * Max-Height
@@ -1284,7 +1234,7 @@ function getDefaultConfig() {
1284
1234
  * @see https://tailwindcss.com/docs/line-height
1285
1235
  */
1286
1236
  leading: [{
1287
- leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isArbitraryValue, isLength]
1237
+ leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
1288
1238
  }],
1289
1239
  /**
1290
1240
  * List Style Image
@@ -1353,21 +1303,21 @@ function getDefaultConfig() {
1353
1303
  * @see https://tailwindcss.com/docs/text-decoration-style
1354
1304
  */
1355
1305
  'text-decoration-style': [{
1356
- decoration: [].concat(getLineStyles(), ['wavy'])
1306
+ decoration: [...getLineStyles(), 'wavy']
1357
1307
  }],
1358
1308
  /**
1359
1309
  * Text Decoration Thickness
1360
1310
  * @see https://tailwindcss.com/docs/text-decoration-thickness
1361
1311
  */
1362
1312
  'text-decoration-thickness': [{
1363
- decoration: ['auto', 'from-font', isLength]
1313
+ decoration: ['auto', 'from-font', isLength, isArbitraryLength]
1364
1314
  }],
1365
1315
  /**
1366
1316
  * Text Underline Offset
1367
1317
  * @see https://tailwindcss.com/docs/text-underline-offset
1368
1318
  */
1369
1319
  'underline-offset': [{
1370
- 'underline-offset': ['auto', isArbitraryValue, isLength]
1320
+ 'underline-offset': ['auto', isLength, isArbitraryValue]
1371
1321
  }],
1372
1322
  /**
1373
1323
  * Text Decoration Color
@@ -1411,8 +1361,8 @@ function getDefaultConfig() {
1411
1361
  * Word Break
1412
1362
  * @see https://tailwindcss.com/docs/word-break
1413
1363
  */
1414
- "break": [{
1415
- "break": ['normal', 'words', 'all', 'keep']
1364
+ break: [{
1365
+ break: ['normal', 'words', 'all', 'keep']
1416
1366
  }],
1417
1367
  /**
1418
1368
  * Hyphens
@@ -1463,7 +1413,7 @@ function getDefaultConfig() {
1463
1413
  * @see https://tailwindcss.com/docs/background-position
1464
1414
  */
1465
1415
  'bg-position': [{
1466
- bg: [].concat(getPositions(), [isArbitraryPosition])
1416
+ bg: [...getPositions(), isArbitraryPosition]
1467
1417
  }],
1468
1418
  /**
1469
1419
  * Background Repeat
@@ -1488,7 +1438,7 @@ function getDefaultConfig() {
1488
1438
  'bg-image': [{
1489
1439
  bg: ['none', {
1490
1440
  'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
1491
- }, isArbitraryUrl]
1441
+ }, isArbitraryImage]
1492
1442
  }],
1493
1443
  /**
1494
1444
  * Background Color
@@ -1720,7 +1670,7 @@ function getDefaultConfig() {
1720
1670
  * @see https://tailwindcss.com/docs/border-style
1721
1671
  */
1722
1672
  'border-style': [{
1723
- border: [].concat(getLineStyles(), ['hidden'])
1673
+ border: [...getLineStyles(), 'hidden']
1724
1674
  }],
1725
1675
  /**
1726
1676
  * Divide Width X
@@ -1821,21 +1771,21 @@ function getDefaultConfig() {
1821
1771
  * @see https://tailwindcss.com/docs/outline-style
1822
1772
  */
1823
1773
  'outline-style': [{
1824
- outline: [''].concat(getLineStyles())
1774
+ outline: ['', ...getLineStyles()]
1825
1775
  }],
1826
1776
  /**
1827
1777
  * Outline Offset
1828
1778
  * @see https://tailwindcss.com/docs/outline-offset
1829
1779
  */
1830
1780
  'outline-offset': [{
1831
- 'outline-offset': [isArbitraryValue, isLength]
1781
+ 'outline-offset': [isLength, isArbitraryValue]
1832
1782
  }],
1833
1783
  /**
1834
1784
  * Outline Width
1835
1785
  * @see https://tailwindcss.com/docs/outline-width
1836
1786
  */
1837
1787
  'outline-w': [{
1838
- outline: [isLength]
1788
+ outline: [isLength, isArbitraryLength]
1839
1789
  }],
1840
1790
  /**
1841
1791
  * Outline Color
@@ -1849,7 +1799,7 @@ function getDefaultConfig() {
1849
1799
  * @see https://tailwindcss.com/docs/ring-width
1850
1800
  */
1851
1801
  'ring-w': [{
1852
- ring: getLengthWithEmpty()
1802
+ ring: getLengthWithEmptyAndArbitrary()
1853
1803
  }],
1854
1804
  /**
1855
1805
  * Ring Width Inset
@@ -1875,7 +1825,7 @@ function getDefaultConfig() {
1875
1825
  * @see https://tailwindcss.com/docs/ring-offset-width
1876
1826
  */
1877
1827
  'ring-offset-w': [{
1878
- 'ring-offset': [isLength]
1828
+ 'ring-offset': [isLength, isArbitraryLength]
1879
1829
  }],
1880
1830
  /**
1881
1831
  * Ring Offset Color
@@ -2420,10 +2370,27 @@ function getDefaultConfig() {
2420
2370
  * @see https://tailwindcss.com/docs/touch-action
2421
2371
  */
2422
2372
  touch: [{
2423
- touch: ['auto', 'none', 'pinch-zoom', 'manipulation', {
2424
- pan: ['x', 'left', 'right', 'y', 'up', 'down']
2425
- }]
2373
+ touch: ['auto', 'none', 'manipulation']
2374
+ }],
2375
+ /**
2376
+ * Touch Action X
2377
+ * @see https://tailwindcss.com/docs/touch-action
2378
+ */
2379
+ 'touch-x': [{
2380
+ 'touch-pan': ['x', 'left', 'right']
2426
2381
  }],
2382
+ /**
2383
+ * Touch Action Y
2384
+ * @see https://tailwindcss.com/docs/touch-action
2385
+ */
2386
+ 'touch-y': [{
2387
+ 'touch-pan': ['y', 'up', 'down']
2388
+ }],
2389
+ /**
2390
+ * Touch Action Pinch Zoom
2391
+ * @see https://tailwindcss.com/docs/touch-action
2392
+ */
2393
+ 'touch-pz': ['touch-pinch-zoom'],
2427
2394
  /**
2428
2395
  * User Select
2429
2396
  * @see https://tailwindcss.com/docs/user-select
@@ -2451,7 +2418,7 @@ function getDefaultConfig() {
2451
2418
  * @see https://tailwindcss.com/docs/stroke-width
2452
2419
  */
2453
2420
  'stroke-w': [{
2454
- stroke: [isLength, isArbitraryNumber]
2421
+ stroke: [isLength, isArbitraryLength, isArbitraryNumber]
2455
2422
  }],
2456
2423
  /**
2457
2424
  * Stroke
@@ -2507,7 +2474,11 @@ function getDefaultConfig() {
2507
2474
  'scroll-my': ['scroll-mt', 'scroll-mb'],
2508
2475
  'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
2509
2476
  'scroll-px': ['scroll-pr', 'scroll-pl'],
2510
- 'scroll-py': ['scroll-pt', 'scroll-pb']
2477
+ 'scroll-py': ['scroll-pt', 'scroll-pb'],
2478
+ touch: ['touch-x', 'touch-y', 'touch-pz'],
2479
+ 'touch-x': ['touch'],
2480
+ 'touch-y': ['touch'],
2481
+ 'touch-pz': ['touch']
2511
2482
  },
2512
2483
  conflictingClassGroupModifiers: {
2513
2484
  'font-size': ['leading']
@@ -2515,12 +2486,75 @@ function getDefaultConfig() {
2515
2486
  };
2516
2487
  }
2517
2488
 
2518
- var twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
2489
+ /**
2490
+ * @param baseConfig Config where other config will be merged into. This object will be mutated.
2491
+ * @param configExtension Partial config to merge into the `baseConfig`.
2492
+ */
2493
+ function mergeConfigs(baseConfig, {
2494
+ cacheSize,
2495
+ prefix,
2496
+ separator,
2497
+ extend = {},
2498
+ override = {}
2499
+ }) {
2500
+ overrideProperty(baseConfig, 'cacheSize', cacheSize);
2501
+ overrideProperty(baseConfig, 'prefix', prefix);
2502
+ overrideProperty(baseConfig, 'separator', separator);
2503
+ for (const configKey in override) {
2504
+ overrideConfigProperties(baseConfig[configKey], override[configKey]);
2505
+ }
2506
+ for (const key in extend) {
2507
+ mergeConfigProperties(baseConfig[key], extend[key]);
2508
+ }
2509
+ return baseConfig;
2510
+ }
2511
+ function overrideProperty(baseObject, overrideKey, overrideValue) {
2512
+ if (overrideValue !== undefined) {
2513
+ baseObject[overrideKey] = overrideValue;
2514
+ }
2515
+ }
2516
+ function overrideConfigProperties(baseObject, overrideObject) {
2517
+ if (overrideObject) {
2518
+ for (const key in overrideObject) {
2519
+ overrideProperty(baseObject, key, overrideObject[key]);
2520
+ }
2521
+ }
2522
+ }
2523
+ function mergeConfigProperties(baseObject, mergeObject) {
2524
+ if (mergeObject) {
2525
+ for (const key in mergeObject) {
2526
+ const mergeValue = mergeObject[key];
2527
+ if (mergeValue !== undefined) {
2528
+ baseObject[key] = (baseObject[key] || []).concat(mergeValue);
2529
+ }
2530
+ }
2531
+ }
2532
+ }
2533
+ function extendTailwindMerge(configExtension, ...createConfig) {
2534
+ return typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
2535
+ }
2519
2536
 
2520
2537
  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}
2521
2538
 
2539
+ const customTwMerge = extendTailwindMerge({
2540
+ classGroups: {
2541
+ shadow: Object.keys(boxShadows).map((s) => `shadow-${s}`),
2542
+ "font-size": Object.keys(fontSizes).map((s) => `text-${s}`),
2543
+ "font-weight": Object.keys(fontWeights).map((s) => `font-${s}`),
2544
+ "line-height": Object.keys(lineHeights).map((s) => `leading-${s}`),
2545
+ scale: Object.keys(scales).map((s) => `scale-${s}`),
2546
+ height: Object.keys(heights).map((s) => `h-${s}`),
2547
+ borderRadius: Object.keys(borderRadius).map((s) => `rounded-${s}`),
2548
+ colors: Object.entries(colorPalette).reduce((acc, currentVal) => {
2549
+ const colors = Object.keys(currentVal[1]).map(
2550
+ (c) => `text-${currentVal[0]}-${c}`
2551
+ );
2552
+ return [...acc, ...colors];
2553
+ }, [])
2554
+ }
2555
+ });
2522
2556
  const cn = (...inputs) => {
2523
- return twMerge(clsx(inputs));
2557
+ return customTwMerge(clsx(inputs));
2524
2558
  };
2525
2559
 
2526
2560
  export { cn };