@lukso/web-components 1.51.6 → 1.52.1

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 (91) hide show
  1. package/dist/{cn-98077c72.cjs → cn-4ec0bd94.cjs} +349 -311
  2. package/dist/{cn-3e29cec8.js → cn-616567d4.js} +346 -308
  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 +6 -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 +6 -2
  46. package/dist/components/lukso-tooltip/index.d.ts.map +1 -1
  47. package/dist/components/lukso-tooltip/index.js +6 -2
  48. package/dist/components/lukso-username/index.cjs +2 -2
  49. package/dist/components/lukso-username/index.js +2 -2
  50. package/dist/components/lukso-wizard/index.cjs +1 -1
  51. package/dist/components/lukso-wizard/index.js +1 -1
  52. package/dist/index-35ca0b42.js +39 -0
  53. package/dist/{index-ee4182e6.js → index-739869da.js} +1 -1
  54. package/dist/{index-beb7703d.cjs → index-ace51f33.cjs} +1 -1
  55. package/dist/index-f426e548.cjs +46 -0
  56. package/dist/index.cjs +6 -6
  57. package/dist/index.js +6 -6
  58. package/dist/shared/tailwind-element/index.cjs +1 -1
  59. package/dist/shared/tailwind-element/index.js +1 -1
  60. package/dist/{style-map-671a0511.cjs → style-map-1175c018.cjs} +1 -1
  61. package/dist/{style-map-5be28c06.js → style-map-17f918a2.js} +1 -1
  62. package/dist/styles/main.css +7 -7
  63. package/dist/{color-palette.cjs → tailwind-config.cjs} +106 -0
  64. package/dist/tailwind-config.d.ts +139 -0
  65. package/dist/tailwind-config.d.ts.map +1 -0
  66. package/{tools/color-palette-18dd9e2f.cjs → dist/tailwind-config.js} +99 -7
  67. package/package.json +8 -5
  68. package/tailwind.config.cjs +9 -121
  69. package/tools/cn.cjs +345 -307
  70. package/tools/cn.d.ts.map +1 -1
  71. package/tools/cn.js +345 -307
  72. package/tools/index.cjs +14 -6
  73. package/tools/index.d.ts +1 -1
  74. package/tools/index.d.ts.map +1 -1
  75. package/tools/index.js +1 -1
  76. package/tools/sass/fonts.scss +8 -8
  77. package/tools/styles/main.css +7 -7
  78. package/{dist/color-palette.js → tools/tailwind-config-351a7d5d.cjs} +113 -1
  79. package/tools/{color-palette-2786d7c1.js → tailwind-config-e0e28660.js} +99 -1
  80. package/tools/tailwind-config.cjs +20 -0
  81. package/tools/tailwind-config.d.ts +139 -0
  82. package/tools/tailwind-config.d.ts.map +1 -0
  83. package/tools/tailwind-config.js +1 -0
  84. package/dist/color-palette.d.ts +0 -42
  85. package/dist/color-palette.d.ts.map +0 -1
  86. package/dist/index-04d11436.js +0 -39
  87. package/dist/index-997f3f0e.cjs +0 -46
  88. package/tools/color-palette.cjs +0 -12
  89. package/tools/color-palette.d.ts +0 -42
  90. package/tools/color-palette.d.ts.map +0 -1
  91. package/tools/color-palette.js +0 -1
@@ -1,61 +1,23 @@
1
1
  'use strict';
2
2
 
3
+ const tailwindConfig = require('./tailwind-config.cjs');
4
+
3
5
  var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
4
- (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
6
+ (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-4ec0bd94.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
5
7
 
6
- (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
8
+ (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-4ec0bd94.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
7
9
 
8
- (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-98077c72.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
10
+ (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.src || new URL('cn-4ec0bd94.cjs', document.baseURI).href)).replace(/^file:\/\/|\/\w+\.?[jt]s$/g, "").replace(/\/index\.[a-z]+$/g, "");
9
11
 
10
- /**
11
- * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
12
- *
13
- * Specifically:
14
- * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
15
- * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
16
- *
17
- * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
18
- */
19
- function twJoin() {
20
- var index = 0;
21
- var argument;
22
- var resolvedValue;
23
- var string = '';
24
- while (index < arguments.length) {
25
- if (argument = arguments[index++]) {
26
- if (resolvedValue = toValue(argument)) {
27
- string && (string += ' ');
28
- string += resolvedValue;
29
- }
30
- }
31
- }
32
- return string;
33
- }
34
- function toValue(mix) {
35
- if (typeof mix === 'string') {
36
- return mix;
37
- }
38
- var resolvedValue;
39
- var string = '';
40
- for (var k = 0; k < mix.length; k++) {
41
- if (mix[k]) {
42
- if (resolvedValue = toValue(mix[k])) {
43
- string && (string += ' ');
44
- string += resolvedValue;
45
- }
46
- }
47
- }
48
- return string;
49
- }
50
-
51
- var CLASS_PART_SEPARATOR = '-';
12
+ const CLASS_PART_SEPARATOR = '-';
52
13
  function createClassUtils(config) {
53
- var classMap = createClassMap(config);
54
- var conflictingClassGroups = config.conflictingClassGroups,
55
- _config$conflictingCl = config.conflictingClassGroupModifiers,
56
- conflictingClassGroupModifiers = _config$conflictingCl === void 0 ? {} : _config$conflictingCl;
14
+ const classMap = createClassMap(config);
15
+ const {
16
+ conflictingClassGroups,
17
+ conflictingClassGroupModifiers
18
+ } = config;
57
19
  function getClassGroupId(className) {
58
- var classParts = className.split(CLASS_PART_SEPARATOR);
20
+ const classParts = className.split(CLASS_PART_SEPARATOR);
59
21
  // 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.
60
22
  if (classParts[0] === '' && classParts.length !== 1) {
61
23
  classParts.shift();
@@ -63,41 +25,40 @@ function createClassUtils(config) {
63
25
  return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
64
26
  }
65
27
  function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
66
- var conflicts = conflictingClassGroups[classGroupId] || [];
28
+ const conflicts = conflictingClassGroups[classGroupId] || [];
67
29
  if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
68
- return [].concat(conflicts, conflictingClassGroupModifiers[classGroupId]);
30
+ return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
69
31
  }
70
32
  return conflicts;
71
33
  }
72
34
  return {
73
- getClassGroupId: getClassGroupId,
74
- getConflictingClassGroupIds: getConflictingClassGroupIds
35
+ getClassGroupId,
36
+ getConflictingClassGroupIds
75
37
  };
76
38
  }
77
39
  function getGroupRecursive(classParts, classPartObject) {
78
40
  if (classParts.length === 0) {
79
41
  return classPartObject.classGroupId;
80
42
  }
81
- var currentClassPart = classParts[0];
82
- var nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
83
- var classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
43
+ const currentClassPart = classParts[0];
44
+ const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
45
+ const classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
84
46
  if (classGroupFromNextClassPart) {
85
47
  return classGroupFromNextClassPart;
86
48
  }
87
49
  if (classPartObject.validators.length === 0) {
88
50
  return undefined;
89
51
  }
90
- var classRest = classParts.join(CLASS_PART_SEPARATOR);
91
- return classPartObject.validators.find(function (_ref) {
92
- var validator = _ref.validator;
93
- return validator(classRest);
94
- })?.classGroupId;
52
+ const classRest = classParts.join(CLASS_PART_SEPARATOR);
53
+ return classPartObject.validators.find(({
54
+ validator
55
+ }) => validator(classRest))?.classGroupId;
95
56
  }
96
- var arbitraryPropertyRegex = /^\[(.+)\]$/;
57
+ const arbitraryPropertyRegex = /^\[(.+)\]$/;
97
58
  function getGroupIdForArbitraryProperty(className) {
98
59
  if (arbitraryPropertyRegex.test(className)) {
99
- var arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
100
- var property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
60
+ const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
61
+ const property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
101
62
  if (property) {
102
63
  // I use two dots here because one dot is used as prefix for class groups in plugins
103
64
  return 'arbitrary..' + property;
@@ -108,24 +69,24 @@ function getGroupIdForArbitraryProperty(className) {
108
69
  * Exported for testing only
109
70
  */
110
71
  function createClassMap(config) {
111
- var theme = config.theme,
112
- prefix = config.prefix;
113
- var classMap = {
72
+ const {
73
+ theme,
74
+ prefix
75
+ } = config;
76
+ const classMap = {
114
77
  nextPart: new Map(),
115
78
  validators: []
116
79
  };
117
- var prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
118
- prefixedClassGroupEntries.forEach(function (_ref2) {
119
- var classGroupId = _ref2[0],
120
- classGroup = _ref2[1];
80
+ const prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
81
+ prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
121
82
  processClassesRecursively(classGroup, classMap, classGroupId, theme);
122
83
  });
123
84
  return classMap;
124
85
  }
125
86
  function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
126
- classGroup.forEach(function (classDefinition) {
87
+ classGroup.forEach(classDefinition => {
127
88
  if (typeof classDefinition === 'string') {
128
- var classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
89
+ const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
129
90
  classPartObjectToEdit.classGroupId = classGroupId;
130
91
  return;
131
92
  }
@@ -136,20 +97,18 @@ function processClassesRecursively(classGroup, classPartObject, classGroupId, th
136
97
  }
137
98
  classPartObject.validators.push({
138
99
  validator: classDefinition,
139
- classGroupId: classGroupId
100
+ classGroupId
140
101
  });
141
102
  return;
142
103
  }
143
- Object.entries(classDefinition).forEach(function (_ref3) {
144
- var key = _ref3[0],
145
- classGroup = _ref3[1];
104
+ Object.entries(classDefinition).forEach(([key, classGroup]) => {
146
105
  processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
147
106
  });
148
107
  });
149
108
  }
150
109
  function getPart(classPartObject, path) {
151
- var currentClassPartObject = classPartObject;
152
- path.split(CLASS_PART_SEPARATOR).forEach(function (pathPart) {
110
+ let currentClassPartObject = classPartObject;
111
+ path.split(CLASS_PART_SEPARATOR).forEach(pathPart => {
153
112
  if (!currentClassPartObject.nextPart.has(pathPart)) {
154
113
  currentClassPartObject.nextPart.set(pathPart, {
155
114
  nextPart: new Map(),
@@ -167,19 +126,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
167
126
  if (!prefix) {
168
127
  return classGroupEntries;
169
128
  }
170
- return classGroupEntries.map(function (_ref4) {
171
- var classGroupId = _ref4[0],
172
- classGroup = _ref4[1];
173
- var prefixedClassGroup = classGroup.map(function (classDefinition) {
129
+ return classGroupEntries.map(([classGroupId, classGroup]) => {
130
+ const prefixedClassGroup = classGroup.map(classDefinition => {
174
131
  if (typeof classDefinition === 'string') {
175
132
  return prefix + classDefinition;
176
133
  }
177
134
  if (typeof classDefinition === 'object') {
178
- return Object.fromEntries(Object.entries(classDefinition).map(function (_ref5) {
179
- var key = _ref5[0],
180
- value = _ref5[1];
181
- return [prefix + key, value];
182
- }));
135
+ return Object.fromEntries(Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]));
183
136
  }
184
137
  return classDefinition;
185
138
  });
@@ -191,15 +144,13 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
191
144
  function createLruCache(maxCacheSize) {
192
145
  if (maxCacheSize < 1) {
193
146
  return {
194
- get: function get() {
195
- return undefined;
196
- },
197
- set: function set() {}
147
+ get: () => undefined,
148
+ set: () => {}
198
149
  };
199
150
  }
200
- var cacheSize = 0;
201
- var cache = new Map();
202
- var previousCache = new Map();
151
+ let cacheSize = 0;
152
+ let cache = new Map();
153
+ let previousCache = new Map();
203
154
  function update(key, value) {
204
155
  cache.set(key, value);
205
156
  cacheSize++;
@@ -210,8 +161,8 @@ function createLruCache(maxCacheSize) {
210
161
  }
211
162
  }
212
163
  return {
213
- get: function get(key) {
214
- var value = cache.get(key);
164
+ get(key) {
165
+ let value = cache.get(key);
215
166
  if (value !== undefined) {
216
167
  return value;
217
168
  }
@@ -220,7 +171,7 @@ function createLruCache(maxCacheSize) {
220
171
  return value;
221
172
  }
222
173
  },
223
- set: function set(key, value) {
174
+ set(key, value) {
224
175
  if (cache.has(key)) {
225
176
  cache.set(key, value);
226
177
  } else {
@@ -229,21 +180,20 @@ function createLruCache(maxCacheSize) {
229
180
  }
230
181
  };
231
182
  }
232
-
233
- var IMPORTANT_MODIFIER = '!';
183
+ const IMPORTANT_MODIFIER = '!';
234
184
  function createSplitModifiers(config) {
235
- var separator = config.separator || ':';
236
- var isSeparatorSingleCharacter = separator.length === 1;
237
- var firstSeparatorCharacter = separator[0];
238
- var separatorLength = separator.length;
185
+ const separator = config.separator;
186
+ const isSeparatorSingleCharacter = separator.length === 1;
187
+ const firstSeparatorCharacter = separator[0];
188
+ const separatorLength = separator.length;
239
189
  // splitModifiers inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
240
190
  return function splitModifiers(className) {
241
- var modifiers = [];
242
- var bracketDepth = 0;
243
- var modifierStart = 0;
244
- var postfixModifierPosition;
245
- for (var index = 0; index < className.length; index++) {
246
- var currentCharacter = className[index];
191
+ const modifiers = [];
192
+ let bracketDepth = 0;
193
+ let modifierStart = 0;
194
+ let postfixModifierPosition;
195
+ for (let index = 0; index < className.length; index++) {
196
+ let currentCharacter = className[index];
247
197
  if (bracketDepth === 0) {
248
198
  if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
249
199
  modifiers.push(className.slice(modifierStart, index));
@@ -261,15 +211,15 @@ function createSplitModifiers(config) {
261
211
  bracketDepth--;
262
212
  }
263
213
  }
264
- var baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
265
- var hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
266
- var baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
267
- var maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
214
+ const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
215
+ const hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
216
+ const baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
217
+ const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
268
218
  return {
269
- modifiers: modifiers,
270
- hasImportantModifier: hasImportantModifier,
271
- baseClassName: baseClassName,
272
- maybePostfixModifierPosition: maybePostfixModifierPosition
219
+ modifiers,
220
+ hasImportantModifier,
221
+ baseClassName,
222
+ maybePostfixModifierPosition
273
223
  };
274
224
  };
275
225
  }
@@ -282,21 +232,20 @@ function sortModifiers(modifiers) {
282
232
  if (modifiers.length <= 1) {
283
233
  return modifiers;
284
234
  }
285
- var sortedModifiers = [];
286
- var unsortedModifiers = [];
287
- modifiers.forEach(function (modifier) {
288
- var isArbitraryVariant = modifier[0] === '[';
235
+ const sortedModifiers = [];
236
+ let unsortedModifiers = [];
237
+ modifiers.forEach(modifier => {
238
+ const isArbitraryVariant = modifier[0] === '[';
289
239
  if (isArbitraryVariant) {
290
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort().concat([modifier]));
240
+ sortedModifiers.push(...unsortedModifiers.sort(), modifier);
291
241
  unsortedModifiers = [];
292
242
  } else {
293
243
  unsortedModifiers.push(modifier);
294
244
  }
295
245
  });
296
- sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort());
246
+ sortedModifiers.push(...unsortedModifiers.sort());
297
247
  return sortedModifiers;
298
248
  }
299
-
300
249
  function createConfigUtils(config) {
301
250
  return {
302
251
  cache: createLruCache(config.cacheSize),
@@ -304,12 +253,13 @@ function createConfigUtils(config) {
304
253
  ...createClassUtils(config)
305
254
  };
306
255
  }
307
-
308
- var SPLIT_CLASSES_REGEX = /\s+/;
256
+ const SPLIT_CLASSES_REGEX = /\s+/;
309
257
  function mergeClassList(classList, configUtils) {
310
- var splitModifiers = configUtils.splitModifiers,
311
- getClassGroupId = configUtils.getClassGroupId,
312
- getConflictingClassGroupIds = configUtils.getConflictingClassGroupIds;
258
+ const {
259
+ splitModifiers,
260
+ getClassGroupId,
261
+ getConflictingClassGroupIds
262
+ } = configUtils;
313
263
  /**
314
264
  * Set of classGroupIds in following format:
315
265
  * `{importantModifier}{variantModifiers}{classGroupId}`
@@ -317,77 +267,109 @@ function mergeClassList(classList, configUtils) {
317
267
  * @example 'hover:focus:bg-color'
318
268
  * @example 'md:!pr'
319
269
  */
320
- var classGroupsInConflict = new Set();
321
- return classList.trim().split(SPLIT_CLASSES_REGEX).map(function (originalClassName) {
322
- var _splitModifiers = splitModifiers(originalClassName),
323
- modifiers = _splitModifiers.modifiers,
324
- hasImportantModifier = _splitModifiers.hasImportantModifier,
325
- baseClassName = _splitModifiers.baseClassName,
326
- maybePostfixModifierPosition = _splitModifiers.maybePostfixModifierPosition;
327
- var classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
328
- var hasPostfixModifier = Boolean(maybePostfixModifierPosition);
270
+ const classGroupsInConflict = new Set();
271
+ return classList.trim().split(SPLIT_CLASSES_REGEX).map(originalClassName => {
272
+ const {
273
+ modifiers,
274
+ hasImportantModifier,
275
+ baseClassName,
276
+ maybePostfixModifierPosition
277
+ } = splitModifiers(originalClassName);
278
+ let classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
279
+ let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
329
280
  if (!classGroupId) {
330
281
  if (!maybePostfixModifierPosition) {
331
282
  return {
332
283
  isTailwindClass: false,
333
- originalClassName: originalClassName
284
+ originalClassName
334
285
  };
335
286
  }
336
287
  classGroupId = getClassGroupId(baseClassName);
337
288
  if (!classGroupId) {
338
289
  return {
339
290
  isTailwindClass: false,
340
- originalClassName: originalClassName
291
+ originalClassName
341
292
  };
342
293
  }
343
294
  hasPostfixModifier = false;
344
295
  }
345
- var variantModifier = sortModifiers(modifiers).join(':');
346
- var modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
296
+ const variantModifier = sortModifiers(modifiers).join(':');
297
+ const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
347
298
  return {
348
299
  isTailwindClass: true,
349
- modifierId: modifierId,
350
- classGroupId: classGroupId,
351
- originalClassName: originalClassName,
352
- hasPostfixModifier: hasPostfixModifier
300
+ modifierId,
301
+ classGroupId,
302
+ originalClassName,
303
+ hasPostfixModifier
353
304
  };
354
305
  }).reverse()
355
306
  // Last class in conflict wins, so we need to filter conflicting classes in reverse order.
356
- .filter(function (parsed) {
307
+ .filter(parsed => {
357
308
  if (!parsed.isTailwindClass) {
358
309
  return true;
359
310
  }
360
- var modifierId = parsed.modifierId,
361
- classGroupId = parsed.classGroupId,
362
- hasPostfixModifier = parsed.hasPostfixModifier;
363
- var classId = modifierId + classGroupId;
311
+ const {
312
+ modifierId,
313
+ classGroupId,
314
+ hasPostfixModifier
315
+ } = parsed;
316
+ const classId = modifierId + classGroupId;
364
317
  if (classGroupsInConflict.has(classId)) {
365
318
  return false;
366
319
  }
367
320
  classGroupsInConflict.add(classId);
368
- getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(function (group) {
369
- return classGroupsInConflict.add(modifierId + group);
370
- });
321
+ getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach(group => classGroupsInConflict.add(modifierId + group));
371
322
  return true;
372
- }).reverse().map(function (parsed) {
373
- return parsed.originalClassName;
374
- }).join(' ');
323
+ }).reverse().map(parsed => parsed.originalClassName).join(' ');
375
324
  }
376
325
 
377
- function createTailwindMerge() {
378
- for (var _len = arguments.length, createConfig = new Array(_len), _key = 0; _key < _len; _key++) {
379
- createConfig[_key] = arguments[_key];
326
+ /**
327
+ * The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
328
+ *
329
+ * Specifically:
330
+ * - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
331
+ * - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
332
+ *
333
+ * Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
334
+ */
335
+ function twJoin() {
336
+ let index = 0;
337
+ let argument;
338
+ let resolvedValue;
339
+ let string = '';
340
+ while (index < arguments.length) {
341
+ if (argument = arguments[index++]) {
342
+ if (resolvedValue = toValue(argument)) {
343
+ string && (string += ' ');
344
+ string += resolvedValue;
345
+ }
346
+ }
347
+ }
348
+ return string;
349
+ }
350
+ function toValue(mix) {
351
+ if (typeof mix === 'string') {
352
+ return mix;
353
+ }
354
+ let resolvedValue;
355
+ let string = '';
356
+ for (let k = 0; k < mix.length; k++) {
357
+ if (mix[k]) {
358
+ if (resolvedValue = toValue(mix[k])) {
359
+ string && (string += ' ');
360
+ string += resolvedValue;
361
+ }
362
+ }
380
363
  }
381
- var configUtils;
382
- var cacheGet;
383
- var cacheSet;
384
- var functionToCall = initTailwindMerge;
364
+ return string;
365
+ }
366
+ function createTailwindMerge(createConfigFirst, ...createConfigRest) {
367
+ let configUtils;
368
+ let cacheGet;
369
+ let cacheSet;
370
+ let functionToCall = initTailwindMerge;
385
371
  function initTailwindMerge(classList) {
386
- var firstCreateConfig = createConfig[0],
387
- restCreateConfig = createConfig.slice(1);
388
- var config = restCreateConfig.reduce(function (previousConfig, createConfigCurrent) {
389
- return createConfigCurrent(previousConfig);
390
- }, firstCreateConfig());
372
+ const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
391
373
  configUtils = createConfigUtils(config);
392
374
  cacheGet = configUtils.cache.get;
393
375
  cacheSet = configUtils.cache.set;
@@ -395,11 +377,11 @@ function createTailwindMerge() {
395
377
  return tailwindMerge(classList);
396
378
  }
397
379
  function tailwindMerge(classList) {
398
- var cachedResult = cacheGet(classList);
380
+ const cachedResult = cacheGet(classList);
399
381
  if (cachedResult) {
400
382
  return cachedResult;
401
383
  }
402
- var result = mergeClassList(classList, configUtils);
384
+ const result = mergeClassList(classList, configUtils);
403
385
  cacheSet(classList, result);
404
386
  return result;
405
387
  }
@@ -407,66 +389,65 @@ function createTailwindMerge() {
407
389
  return functionToCall(twJoin.apply(null, arguments));
408
390
  };
409
391
  }
410
-
411
392
  function fromTheme(key) {
412
- var themeGetter = function themeGetter(theme) {
413
- return theme[key] || [];
414
- };
393
+ const themeGetter = theme => theme[key] || [];
415
394
  themeGetter.isThemeGetter = true;
416
395
  return themeGetter;
417
396
  }
418
-
419
- var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
420
- var fractionRegex = /^\d+\/\d+$/;
421
- var stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
422
- var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
423
- 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$/;
397
+ const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
398
+ const fractionRegex = /^\d+\/\d+$/;
399
+ const stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
400
+ const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
401
+ 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$/;
424
402
  // Shadow always begins with x and y offset separated by underscore
425
- var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
403
+ const shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
404
+ const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
426
405
  function isLength(value) {
427
- return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value) || isArbitraryLength(value);
406
+ return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
428
407
  }
429
408
  function isArbitraryLength(value) {
430
409
  return getIsArbitraryValue(value, 'length', isLengthOnly);
431
410
  }
432
- function isArbitrarySize(value) {
433
- return getIsArbitraryValue(value, 'size', isNever);
434
- }
435
- function isArbitraryPosition(value) {
436
- return getIsArbitraryValue(value, 'position', isNever);
437
- }
438
- function isArbitraryUrl(value) {
439
- return getIsArbitraryValue(value, 'url', isUrl);
411
+ function isNumber(value) {
412
+ return Boolean(value) && !Number.isNaN(Number(value));
440
413
  }
441
414
  function isArbitraryNumber(value) {
442
415
  return getIsArbitraryValue(value, 'number', isNumber);
443
416
  }
444
- function isNumber(value) {
445
- return !Number.isNaN(Number(value));
417
+ function isInteger(value) {
418
+ return Boolean(value) && Number.isInteger(Number(value));
446
419
  }
447
420
  function isPercent(value) {
448
421
  return value.endsWith('%') && isNumber(value.slice(0, -1));
449
422
  }
450
- function isInteger(value) {
451
- return isIntegerOnly(value) || getIsArbitraryValue(value, 'number', isIntegerOnly);
452
- }
453
423
  function isArbitraryValue(value) {
454
424
  return arbitraryValueRegex.test(value);
455
425
  }
456
- function isAny() {
457
- return true;
458
- }
459
426
  function isTshirtSize(value) {
460
427
  return tshirtUnitRegex.test(value);
461
428
  }
429
+ const sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
430
+ function isArbitrarySize(value) {
431
+ return getIsArbitraryValue(value, sizeLabels, isNever);
432
+ }
433
+ function isArbitraryPosition(value) {
434
+ return getIsArbitraryValue(value, 'position', isNever);
435
+ }
436
+ const imageLabels = /*#__PURE__*/new Set(['image', 'url']);
437
+ function isArbitraryImage(value) {
438
+ return getIsArbitraryValue(value, imageLabels, isImage);
439
+ }
462
440
  function isArbitraryShadow(value) {
463
441
  return getIsArbitraryValue(value, '', isShadow);
464
442
  }
443
+ function isAny() {
444
+ return true;
445
+ }
465
446
  function getIsArbitraryValue(value, label, testValue) {
466
- var result = arbitraryValueRegex.exec(value);
447
+ const result = arbitraryValueRegex.exec(value);
467
448
  if (result) {
468
449
  if (result[1]) {
469
- return result[1] === label;
450
+ return typeof label === 'string' ? result[1] === label : label.has(result[1]);
470
451
  }
471
452
  return testValue(result[2]);
472
453
  }
@@ -478,95 +459,64 @@ function isLengthOnly(value) {
478
459
  function isNever() {
479
460
  return false;
480
461
  }
481
- function isUrl(value) {
482
- return value.startsWith('url(');
483
- }
484
- function isIntegerOnly(value) {
485
- return Number.isInteger(Number(value));
486
- }
487
462
  function isShadow(value) {
488
463
  return shadowRegex.test(value);
489
464
  }
490
-
465
+ function isImage(value) {
466
+ return imageRegex.test(value);
467
+ }
491
468
  function getDefaultConfig() {
492
- var colors = fromTheme('colors');
493
- var spacing = fromTheme('spacing');
494
- var blur = fromTheme('blur');
495
- var brightness = fromTheme('brightness');
496
- var borderColor = fromTheme('borderColor');
497
- var borderRadius = fromTheme('borderRadius');
498
- var borderSpacing = fromTheme('borderSpacing');
499
- var borderWidth = fromTheme('borderWidth');
500
- var contrast = fromTheme('contrast');
501
- var grayscale = fromTheme('grayscale');
502
- var hueRotate = fromTheme('hueRotate');
503
- var invert = fromTheme('invert');
504
- var gap = fromTheme('gap');
505
- var gradientColorStops = fromTheme('gradientColorStops');
506
- var gradientColorStopPositions = fromTheme('gradientColorStopPositions');
507
- var inset = fromTheme('inset');
508
- var margin = fromTheme('margin');
509
- var opacity = fromTheme('opacity');
510
- var padding = fromTheme('padding');
511
- var saturate = fromTheme('saturate');
512
- var scale = fromTheme('scale');
513
- var sepia = fromTheme('sepia');
514
- var skew = fromTheme('skew');
515
- var space = fromTheme('space');
516
- var translate = fromTheme('translate');
517
- var getOverscroll = function getOverscroll() {
518
- return ['auto', 'contain', 'none'];
519
- };
520
- var getOverflow = function getOverflow() {
521
- return ['auto', 'hidden', 'clip', 'visible', 'scroll'];
522
- };
523
- var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary() {
524
- return ['auto', isArbitraryValue, spacing];
525
- };
526
- var getSpacingWithArbitrary = function getSpacingWithArbitrary() {
527
- return [isArbitraryValue, spacing];
528
- };
529
- var getLengthWithEmpty = function getLengthWithEmpty() {
530
- return ['', isLength];
531
- };
532
- var getNumberWithAutoAndArbitrary = function getNumberWithAutoAndArbitrary() {
533
- return ['auto', isNumber, isArbitraryValue];
534
- };
535
- var getPositions = function getPositions() {
536
- return ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
537
- };
538
- var getLineStyles = function getLineStyles() {
539
- return ['solid', 'dashed', 'dotted', 'double', 'none'];
540
- };
541
- var getBlendModes = function getBlendModes() {
542
- return ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
543
- };
544
- var getAlign = function getAlign() {
545
- return ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
546
- };
547
- var getZeroAndEmpty = function getZeroAndEmpty() {
548
- return ['', '0', isArbitraryValue];
549
- };
550
- var getBreaks = function getBreaks() {
551
- return ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
552
- };
553
- var getNumber = function getNumber() {
554
- return [isNumber, isArbitraryNumber];
555
- };
556
- var getNumberAndArbitrary = function getNumberAndArbitrary() {
557
- return [isNumber, isArbitraryValue];
558
- };
469
+ const colors = fromTheme('colors');
470
+ const spacing = fromTheme('spacing');
471
+ const blur = fromTheme('blur');
472
+ const brightness = fromTheme('brightness');
473
+ const borderColor = fromTheme('borderColor');
474
+ const borderRadius = fromTheme('borderRadius');
475
+ const borderSpacing = fromTheme('borderSpacing');
476
+ const borderWidth = fromTheme('borderWidth');
477
+ const contrast = fromTheme('contrast');
478
+ const grayscale = fromTheme('grayscale');
479
+ const hueRotate = fromTheme('hueRotate');
480
+ const invert = fromTheme('invert');
481
+ const gap = fromTheme('gap');
482
+ const gradientColorStops = fromTheme('gradientColorStops');
483
+ const gradientColorStopPositions = fromTheme('gradientColorStopPositions');
484
+ const inset = fromTheme('inset');
485
+ const margin = fromTheme('margin');
486
+ const opacity = fromTheme('opacity');
487
+ const padding = fromTheme('padding');
488
+ const saturate = fromTheme('saturate');
489
+ const scale = fromTheme('scale');
490
+ const sepia = fromTheme('sepia');
491
+ const skew = fromTheme('skew');
492
+ const space = fromTheme('space');
493
+ const translate = fromTheme('translate');
494
+ const getOverscroll = () => ['auto', 'contain', 'none'];
495
+ const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
496
+ const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing];
497
+ const getSpacingWithArbitrary = () => [isArbitraryValue, spacing];
498
+ const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength];
499
+ const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue];
500
+ const getPositions = () => ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
501
+ const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'];
502
+ const getBlendModes = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity', 'plus-lighter'];
503
+ const getAlign = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
504
+ const getZeroAndEmpty = () => ['', '0', isArbitraryValue];
505
+ const getBreaks = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
506
+ const getNumber = () => [isNumber, isArbitraryNumber];
507
+ const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
559
508
  return {
560
509
  cacheSize: 500,
510
+ separator: ':',
561
511
  theme: {
562
512
  colors: [isAny],
563
- spacing: [isLength],
513
+ spacing: [isLength, isArbitraryLength],
564
514
  blur: ['none', '', isTshirtSize, isArbitraryValue],
565
515
  brightness: getNumber(),
566
516
  borderColor: [colors],
567
517
  borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
568
518
  borderSpacing: getSpacingWithArbitrary(),
569
- borderWidth: getLengthWithEmpty(),
519
+ borderWidth: getLengthWithEmptyAndArbitrary(),
570
520
  contrast: getNumber(),
571
521
  grayscale: getZeroAndEmpty(),
572
522
  hueRotate: getNumberAndArbitrary(),
@@ -650,8 +600,8 @@ function getDefaultConfig() {
650
600
  * Floats
651
601
  * @see https://tailwindcss.com/docs/float
652
602
  */
653
- "float": [{
654
- "float": ['right', 'left', 'none']
603
+ float: [{
604
+ float: ['right', 'left', 'none']
655
605
  }],
656
606
  /**
657
607
  * Clear
@@ -677,7 +627,7 @@ function getDefaultConfig() {
677
627
  * @see https://tailwindcss.com/docs/object-position
678
628
  */
679
629
  'object-position': [{
680
- object: [].concat(getPositions(), [isArbitraryValue])
630
+ object: [...getPositions(), isArbitraryValue]
681
631
  }],
682
632
  /**
683
633
  * Overflow
@@ -799,7 +749,7 @@ function getDefaultConfig() {
799
749
  * @see https://tailwindcss.com/docs/z-index
800
750
  */
801
751
  z: [{
802
- z: ['auto', isInteger]
752
+ z: ['auto', isInteger, isArbitraryValue]
803
753
  }],
804
754
  // Flexbox and Grid
805
755
  /**
@@ -849,7 +799,7 @@ function getDefaultConfig() {
849
799
  * @see https://tailwindcss.com/docs/order
850
800
  */
851
801
  order: [{
852
- order: ['first', 'last', 'none', isInteger]
802
+ order: ['first', 'last', 'none', isInteger, isArbitraryValue]
853
803
  }],
854
804
  /**
855
805
  * Grid Template Columns
@@ -864,7 +814,7 @@ function getDefaultConfig() {
864
814
  */
865
815
  'col-start-end': [{
866
816
  col: ['auto', {
867
- span: ['full', isInteger]
817
+ span: ['full', isInteger, isArbitraryValue]
868
818
  }, isArbitraryValue]
869
819
  }],
870
820
  /**
@@ -894,7 +844,7 @@ function getDefaultConfig() {
894
844
  */
895
845
  'row-start-end': [{
896
846
  row: ['auto', {
897
- span: [isInteger]
847
+ span: [isInteger, isArbitraryValue]
898
848
  }, isArbitraryValue]
899
849
  }],
900
850
  /**
@@ -958,7 +908,7 @@ function getDefaultConfig() {
958
908
  * @see https://tailwindcss.com/docs/justify-content
959
909
  */
960
910
  'justify-content': [{
961
- justify: ['normal'].concat(getAlign())
911
+ justify: ['normal', ...getAlign()]
962
912
  }],
963
913
  /**
964
914
  * Justify Items
@@ -979,7 +929,7 @@ function getDefaultConfig() {
979
929
  * @see https://tailwindcss.com/docs/align-content
980
930
  */
981
931
  'align-content': [{
982
- content: ['normal'].concat(getAlign(), ['baseline'])
932
+ content: ['normal', ...getAlign(), 'baseline']
983
933
  }],
984
934
  /**
985
935
  * Align Items
@@ -1000,7 +950,7 @@ function getDefaultConfig() {
1000
950
  * @see https://tailwindcss.com/docs/place-content
1001
951
  */
1002
952
  'place-content': [{
1003
- 'place-content': [].concat(getAlign(), ['baseline'])
953
+ 'place-content': [...getAlign(), 'baseline']
1004
954
  }],
1005
955
  /**
1006
956
  * Place Items
@@ -1203,7 +1153,7 @@ function getDefaultConfig() {
1203
1153
  * @see https://tailwindcss.com/docs/min-height
1204
1154
  */
1205
1155
  'min-h': [{
1206
- 'min-h': ['min', 'max', 'fit', isArbitraryValue, isLength]
1156
+ 'min-h': ['min', 'max', 'fit', isLength, isArbitraryValue]
1207
1157
  }],
1208
1158
  /**
1209
1159
  * Max-Height
@@ -1293,7 +1243,7 @@ function getDefaultConfig() {
1293
1243
  * @see https://tailwindcss.com/docs/line-height
1294
1244
  */
1295
1245
  leading: [{
1296
- leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isArbitraryValue, isLength]
1246
+ leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
1297
1247
  }],
1298
1248
  /**
1299
1249
  * List Style Image
@@ -1362,21 +1312,21 @@ function getDefaultConfig() {
1362
1312
  * @see https://tailwindcss.com/docs/text-decoration-style
1363
1313
  */
1364
1314
  'text-decoration-style': [{
1365
- decoration: [].concat(getLineStyles(), ['wavy'])
1315
+ decoration: [...getLineStyles(), 'wavy']
1366
1316
  }],
1367
1317
  /**
1368
1318
  * Text Decoration Thickness
1369
1319
  * @see https://tailwindcss.com/docs/text-decoration-thickness
1370
1320
  */
1371
1321
  'text-decoration-thickness': [{
1372
- decoration: ['auto', 'from-font', isLength]
1322
+ decoration: ['auto', 'from-font', isLength, isArbitraryLength]
1373
1323
  }],
1374
1324
  /**
1375
1325
  * Text Underline Offset
1376
1326
  * @see https://tailwindcss.com/docs/text-underline-offset
1377
1327
  */
1378
1328
  'underline-offset': [{
1379
- 'underline-offset': ['auto', isArbitraryValue, isLength]
1329
+ 'underline-offset': ['auto', isLength, isArbitraryValue]
1380
1330
  }],
1381
1331
  /**
1382
1332
  * Text Decoration Color
@@ -1420,8 +1370,8 @@ function getDefaultConfig() {
1420
1370
  * Word Break
1421
1371
  * @see https://tailwindcss.com/docs/word-break
1422
1372
  */
1423
- "break": [{
1424
- "break": ['normal', 'words', 'all', 'keep']
1373
+ break: [{
1374
+ break: ['normal', 'words', 'all', 'keep']
1425
1375
  }],
1426
1376
  /**
1427
1377
  * Hyphens
@@ -1472,7 +1422,7 @@ function getDefaultConfig() {
1472
1422
  * @see https://tailwindcss.com/docs/background-position
1473
1423
  */
1474
1424
  'bg-position': [{
1475
- bg: [].concat(getPositions(), [isArbitraryPosition])
1425
+ bg: [...getPositions(), isArbitraryPosition]
1476
1426
  }],
1477
1427
  /**
1478
1428
  * Background Repeat
@@ -1497,7 +1447,7 @@ function getDefaultConfig() {
1497
1447
  'bg-image': [{
1498
1448
  bg: ['none', {
1499
1449
  'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
1500
- }, isArbitraryUrl]
1450
+ }, isArbitraryImage]
1501
1451
  }],
1502
1452
  /**
1503
1453
  * Background Color
@@ -1729,7 +1679,7 @@ function getDefaultConfig() {
1729
1679
  * @see https://tailwindcss.com/docs/border-style
1730
1680
  */
1731
1681
  'border-style': [{
1732
- border: [].concat(getLineStyles(), ['hidden'])
1682
+ border: [...getLineStyles(), 'hidden']
1733
1683
  }],
1734
1684
  /**
1735
1685
  * Divide Width X
@@ -1830,21 +1780,21 @@ function getDefaultConfig() {
1830
1780
  * @see https://tailwindcss.com/docs/outline-style
1831
1781
  */
1832
1782
  'outline-style': [{
1833
- outline: [''].concat(getLineStyles())
1783
+ outline: ['', ...getLineStyles()]
1834
1784
  }],
1835
1785
  /**
1836
1786
  * Outline Offset
1837
1787
  * @see https://tailwindcss.com/docs/outline-offset
1838
1788
  */
1839
1789
  'outline-offset': [{
1840
- 'outline-offset': [isArbitraryValue, isLength]
1790
+ 'outline-offset': [isLength, isArbitraryValue]
1841
1791
  }],
1842
1792
  /**
1843
1793
  * Outline Width
1844
1794
  * @see https://tailwindcss.com/docs/outline-width
1845
1795
  */
1846
1796
  'outline-w': [{
1847
- outline: [isLength]
1797
+ outline: [isLength, isArbitraryLength]
1848
1798
  }],
1849
1799
  /**
1850
1800
  * Outline Color
@@ -1858,7 +1808,7 @@ function getDefaultConfig() {
1858
1808
  * @see https://tailwindcss.com/docs/ring-width
1859
1809
  */
1860
1810
  'ring-w': [{
1861
- ring: getLengthWithEmpty()
1811
+ ring: getLengthWithEmptyAndArbitrary()
1862
1812
  }],
1863
1813
  /**
1864
1814
  * Ring Width Inset
@@ -1884,7 +1834,7 @@ function getDefaultConfig() {
1884
1834
  * @see https://tailwindcss.com/docs/ring-offset-width
1885
1835
  */
1886
1836
  'ring-offset-w': [{
1887
- 'ring-offset': [isLength]
1837
+ 'ring-offset': [isLength, isArbitraryLength]
1888
1838
  }],
1889
1839
  /**
1890
1840
  * Ring Offset Color
@@ -2429,10 +2379,27 @@ function getDefaultConfig() {
2429
2379
  * @see https://tailwindcss.com/docs/touch-action
2430
2380
  */
2431
2381
  touch: [{
2432
- touch: ['auto', 'none', 'pinch-zoom', 'manipulation', {
2433
- pan: ['x', 'left', 'right', 'y', 'up', 'down']
2434
- }]
2382
+ touch: ['auto', 'none', 'manipulation']
2383
+ }],
2384
+ /**
2385
+ * Touch Action X
2386
+ * @see https://tailwindcss.com/docs/touch-action
2387
+ */
2388
+ 'touch-x': [{
2389
+ 'touch-pan': ['x', 'left', 'right']
2435
2390
  }],
2391
+ /**
2392
+ * Touch Action Y
2393
+ * @see https://tailwindcss.com/docs/touch-action
2394
+ */
2395
+ 'touch-y': [{
2396
+ 'touch-pan': ['y', 'up', 'down']
2397
+ }],
2398
+ /**
2399
+ * Touch Action Pinch Zoom
2400
+ * @see https://tailwindcss.com/docs/touch-action
2401
+ */
2402
+ 'touch-pz': ['touch-pinch-zoom'],
2436
2403
  /**
2437
2404
  * User Select
2438
2405
  * @see https://tailwindcss.com/docs/user-select
@@ -2460,7 +2427,7 @@ function getDefaultConfig() {
2460
2427
  * @see https://tailwindcss.com/docs/stroke-width
2461
2428
  */
2462
2429
  'stroke-w': [{
2463
- stroke: [isLength, isArbitraryNumber]
2430
+ stroke: [isLength, isArbitraryLength, isArbitraryNumber]
2464
2431
  }],
2465
2432
  /**
2466
2433
  * Stroke
@@ -2516,7 +2483,11 @@ function getDefaultConfig() {
2516
2483
  'scroll-my': ['scroll-mt', 'scroll-mb'],
2517
2484
  'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
2518
2485
  'scroll-px': ['scroll-pr', 'scroll-pl'],
2519
- 'scroll-py': ['scroll-pt', 'scroll-pb']
2486
+ 'scroll-py': ['scroll-pt', 'scroll-pb'],
2487
+ touch: ['touch-x', 'touch-y', 'touch-pz'],
2488
+ 'touch-x': ['touch'],
2489
+ 'touch-y': ['touch'],
2490
+ 'touch-pz': ['touch']
2520
2491
  },
2521
2492
  conflictingClassGroupModifiers: {
2522
2493
  'font-size': ['leading']
@@ -2524,12 +2495,79 @@ function getDefaultConfig() {
2524
2495
  };
2525
2496
  }
2526
2497
 
2527
- var twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
2498
+ /**
2499
+ * @param baseConfig Config where other config will be merged into. This object will be mutated.
2500
+ * @param configExtension Partial config to merge into the `baseConfig`.
2501
+ */
2502
+ function mergeConfigs(baseConfig, {
2503
+ cacheSize,
2504
+ prefix,
2505
+ separator,
2506
+ extend = {},
2507
+ override = {}
2508
+ }) {
2509
+ overrideProperty(baseConfig, 'cacheSize', cacheSize);
2510
+ overrideProperty(baseConfig, 'prefix', prefix);
2511
+ overrideProperty(baseConfig, 'separator', separator);
2512
+ for (const configKey in override) {
2513
+ overrideConfigProperties(baseConfig[configKey], override[configKey]);
2514
+ }
2515
+ for (const key in extend) {
2516
+ mergeConfigProperties(baseConfig[key], extend[key]);
2517
+ }
2518
+ return baseConfig;
2519
+ }
2520
+ function overrideProperty(baseObject, overrideKey, overrideValue) {
2521
+ if (overrideValue !== undefined) {
2522
+ baseObject[overrideKey] = overrideValue;
2523
+ }
2524
+ }
2525
+ function overrideConfigProperties(baseObject, overrideObject) {
2526
+ if (overrideObject) {
2527
+ for (const key in overrideObject) {
2528
+ overrideProperty(baseObject, key, overrideObject[key]);
2529
+ }
2530
+ }
2531
+ }
2532
+ function mergeConfigProperties(baseObject, mergeObject) {
2533
+ if (mergeObject) {
2534
+ for (const key in mergeObject) {
2535
+ const mergeValue = mergeObject[key];
2536
+ if (mergeValue !== undefined) {
2537
+ baseObject[key] = (baseObject[key] || []).concat(mergeValue);
2538
+ }
2539
+ }
2540
+ }
2541
+ }
2542
+ function extendTailwindMerge(configExtension, ...createConfig) {
2543
+ return typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
2544
+ }
2528
2545
 
2529
2546
  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}
2530
2547
 
2548
+ const customTwMerge = extendTailwindMerge({
2549
+ extend: {
2550
+ theme: {
2551
+ colors: Object.entries(tailwindConfig.colorPalette).reduce((acc, currentVal) => {
2552
+ const colors = Object.keys(currentVal[1]).map(
2553
+ (c) => `text-${currentVal[0]}-${c}`
2554
+ );
2555
+ return [...acc, ...colors];
2556
+ }, []),
2557
+ borderRadius: Object.keys(tailwindConfig.borderRadius).map((s) => `rounded-${s}`)
2558
+ },
2559
+ classGroups: {
2560
+ shadow: [{ shadow: Object.keys(tailwindConfig.boxShadows).map((s) => `shadow-${s}`) }],
2561
+ "font-size": Object.keys(tailwindConfig.fontSizes).map((s) => `text-${s}`),
2562
+ "font-weight": Object.keys(tailwindConfig.fontWeights).map((s) => `font-${s}`),
2563
+ scale: Object.keys(tailwindConfig.scales).map((s) => `scale-${s}`),
2564
+ h: Object.keys(tailwindConfig.heights).map((s) => `h-${s}`),
2565
+ leading: Object.keys(tailwindConfig.lineHeights).map((s) => `leading-${s}`)
2566
+ }
2567
+ }
2568
+ });
2531
2569
  const cn = (...inputs) => {
2532
- return twMerge(clsx(inputs));
2570
+ return customTwMerge(clsx(inputs));
2533
2571
  };
2534
2572
 
2535
2573
  exports.cn = cn;