tailwindcss 3.4.1 → 4.0.0-alpha.2

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 (280) hide show
  1. package/README.md +5 -6
  2. package/dist/lib.d.mts +324 -0
  3. package/dist/lib.d.ts +324 -0
  4. package/dist/lib.js +11 -0
  5. package/dist/lib.mjs +11 -0
  6. package/index.css +5 -0
  7. package/package.json +29 -107
  8. package/preflight.css +355 -0
  9. package/theme.css +465 -0
  10. package/CHANGELOG.md +0 -2571
  11. package/base.css +0 -1
  12. package/colors.d.ts +0 -3
  13. package/colors.js +0 -2
  14. package/components.css +0 -1
  15. package/defaultConfig.d.ts +0 -3
  16. package/defaultConfig.js +0 -2
  17. package/defaultTheme.d.ts +0 -4
  18. package/defaultTheme.js +0 -2
  19. package/lib/cli/build/deps.js +0 -62
  20. package/lib/cli/build/index.js +0 -54
  21. package/lib/cli/build/plugin.js +0 -378
  22. package/lib/cli/build/utils.js +0 -88
  23. package/lib/cli/build/watching.js +0 -182
  24. package/lib/cli/help/index.js +0 -73
  25. package/lib/cli/index.js +0 -230
  26. package/lib/cli/init/index.js +0 -63
  27. package/lib/cli-peer-dependencies.js +0 -36
  28. package/lib/cli.js +0 -7
  29. package/lib/corePluginList.js +0 -190
  30. package/lib/corePlugins.js +0 -4282
  31. package/lib/css/LICENSE +0 -25
  32. package/lib/css/preflight.css +0 -385
  33. package/lib/featureFlags.js +0 -83
  34. package/lib/index.js +0 -2
  35. package/lib/lib/cacheInvalidation.js +0 -92
  36. package/lib/lib/collapseAdjacentRules.js +0 -61
  37. package/lib/lib/collapseDuplicateDeclarations.js +0 -85
  38. package/lib/lib/content.js +0 -181
  39. package/lib/lib/defaultExtractor.js +0 -251
  40. package/lib/lib/detectNesting.js +0 -45
  41. package/lib/lib/evaluateTailwindFunctions.js +0 -238
  42. package/lib/lib/expandApplyAtRules.js +0 -540
  43. package/lib/lib/expandTailwindAtRules.js +0 -291
  44. package/lib/lib/findAtConfigPath.js +0 -46
  45. package/lib/lib/generateRules.js +0 -904
  46. package/lib/lib/getModuleDependencies.js +0 -99
  47. package/lib/lib/load-config.js +0 -53
  48. package/lib/lib/normalizeTailwindDirectives.js +0 -89
  49. package/lib/lib/offsets.js +0 -306
  50. package/lib/lib/partitionApplyAtRules.js +0 -58
  51. package/lib/lib/regex.js +0 -74
  52. package/lib/lib/remap-bitfield.js +0 -89
  53. package/lib/lib/resolveDefaultsAtRules.js +0 -165
  54. package/lib/lib/setupContextUtils.js +0 -1294
  55. package/lib/lib/setupTrackingContext.js +0 -166
  56. package/lib/lib/sharedState.js +0 -87
  57. package/lib/lib/substituteScreenAtRules.js +0 -31
  58. package/lib/oxide/cli/build/deps.js +0 -89
  59. package/lib/oxide/cli/build/index.js +0 -53
  60. package/lib/oxide/cli/build/plugin.js +0 -375
  61. package/lib/oxide/cli/build/utils.js +0 -87
  62. package/lib/oxide/cli/build/watching.js +0 -179
  63. package/lib/oxide/cli/help/index.js +0 -72
  64. package/lib/oxide/cli/index.js +0 -214
  65. package/lib/oxide/cli/init/index.js +0 -52
  66. package/lib/oxide/cli.js +0 -5
  67. package/lib/oxide/postcss-plugin.js +0 -2
  68. package/lib/plugin.js +0 -98
  69. package/lib/postcss-plugins/nesting/README.md +0 -42
  70. package/lib/postcss-plugins/nesting/index.js +0 -21
  71. package/lib/postcss-plugins/nesting/plugin.js +0 -89
  72. package/lib/processTailwindFeatures.js +0 -64
  73. package/lib/public/colors.js +0 -355
  74. package/lib/public/create-plugin.js +0 -17
  75. package/lib/public/default-config.js +0 -18
  76. package/lib/public/default-theme.js +0 -18
  77. package/lib/public/load-config.js +0 -12
  78. package/lib/public/resolve-config.js +0 -24
  79. package/lib/util/applyImportantSelector.js +0 -36
  80. package/lib/util/bigSign.js +0 -13
  81. package/lib/util/buildMediaQuery.js +0 -27
  82. package/lib/util/cloneDeep.js +0 -22
  83. package/lib/util/cloneNodes.js +0 -54
  84. package/lib/util/color.js +0 -116
  85. package/lib/util/colorNames.js +0 -752
  86. package/lib/util/configurePlugins.js +0 -23
  87. package/lib/util/createPlugin.js +0 -32
  88. package/lib/util/createUtilityPlugin.js +0 -53
  89. package/lib/util/dataTypes.js +0 -415
  90. package/lib/util/defaults.js +0 -27
  91. package/lib/util/escapeClassName.js +0 -24
  92. package/lib/util/escapeCommas.js +0 -13
  93. package/lib/util/flattenColorPalette.js +0 -18
  94. package/lib/util/formatVariantSelector.js +0 -270
  95. package/lib/util/getAllConfigs.js +0 -50
  96. package/lib/util/hashConfig.js +0 -21
  97. package/lib/util/isKeyframeRule.js +0 -13
  98. package/lib/util/isPlainObject.js +0 -17
  99. package/lib/util/isSyntacticallyValidPropertyValue.js +0 -74
  100. package/lib/util/log.js +0 -61
  101. package/lib/util/nameClass.js +0 -49
  102. package/lib/util/negateValue.js +0 -36
  103. package/lib/util/normalizeConfig.js +0 -282
  104. package/lib/util/normalizeScreens.js +0 -178
  105. package/lib/util/parseAnimationValue.js +0 -93
  106. package/lib/util/parseBoxShadowValue.js +0 -88
  107. package/lib/util/parseDependency.js +0 -47
  108. package/lib/util/parseGlob.js +0 -36
  109. package/lib/util/parseObjectStyles.js +0 -36
  110. package/lib/util/pluginUtils.js +0 -289
  111. package/lib/util/prefixSelector.js +0 -39
  112. package/lib/util/pseudoElements.js +0 -212
  113. package/lib/util/removeAlphaVariables.js +0 -31
  114. package/lib/util/resolveConfig.js +0 -256
  115. package/lib/util/resolveConfigPath.js +0 -70
  116. package/lib/util/responsive.js +0 -24
  117. package/lib/util/splitAtTopLevelOnly.js +0 -51
  118. package/lib/util/tap.js +0 -14
  119. package/lib/util/toColorValue.js +0 -13
  120. package/lib/util/toPath.js +0 -32
  121. package/lib/util/transformThemeValue.js +0 -73
  122. package/lib/util/validateConfig.js +0 -37
  123. package/lib/util/validateFormalSyntax.js +0 -26
  124. package/lib/util/withAlphaVariable.js +0 -79
  125. package/lib/value-parser/LICENSE +0 -22
  126. package/lib/value-parser/README.md +0 -3
  127. package/lib/value-parser/index.d.js +0 -2
  128. package/lib/value-parser/index.js +0 -22
  129. package/lib/value-parser/parse.js +0 -259
  130. package/lib/value-parser/stringify.js +0 -38
  131. package/lib/value-parser/unit.js +0 -86
  132. package/lib/value-parser/walk.js +0 -16
  133. package/loadConfig.d.ts +0 -4
  134. package/loadConfig.js +0 -2
  135. package/nesting/index.d.ts +0 -4
  136. package/nesting/index.js +0 -2
  137. package/peers/index.js +0 -96624
  138. package/plugin.d.ts +0 -11
  139. package/plugin.js +0 -2
  140. package/prettier.config.js +0 -19
  141. package/resolveConfig.d.ts +0 -31
  142. package/resolveConfig.js +0 -2
  143. package/screens.css +0 -1
  144. package/scripts/create-plugin-list.js +0 -10
  145. package/scripts/generate-types.js +0 -104
  146. package/scripts/release-channel.js +0 -18
  147. package/scripts/release-notes.js +0 -21
  148. package/scripts/swap-engines.js +0 -40
  149. package/scripts/type-utils.js +0 -27
  150. package/src/cli/build/deps.js +0 -56
  151. package/src/cli/build/index.js +0 -49
  152. package/src/cli/build/plugin.js +0 -444
  153. package/src/cli/build/utils.js +0 -76
  154. package/src/cli/build/watching.js +0 -229
  155. package/src/cli/help/index.js +0 -70
  156. package/src/cli/index.js +0 -216
  157. package/src/cli/init/index.js +0 -79
  158. package/src/cli-peer-dependencies.js +0 -15
  159. package/src/cli.js +0 -7
  160. package/src/corePluginList.js +0 -1
  161. package/src/corePlugins.js +0 -2943
  162. package/src/css/LICENSE +0 -25
  163. package/src/css/preflight.css +0 -385
  164. package/src/featureFlags.js +0 -66
  165. package/src/index.js +0 -1
  166. package/src/lib/cacheInvalidation.js +0 -52
  167. package/src/lib/collapseAdjacentRules.js +0 -58
  168. package/src/lib/collapseDuplicateDeclarations.js +0 -93
  169. package/src/lib/content.js +0 -208
  170. package/src/lib/defaultExtractor.js +0 -230
  171. package/src/lib/detectNesting.js +0 -47
  172. package/src/lib/evaluateTailwindFunctions.js +0 -272
  173. package/src/lib/expandApplyAtRules.js +0 -620
  174. package/src/lib/expandTailwindAtRules.js +0 -300
  175. package/src/lib/findAtConfigPath.js +0 -48
  176. package/src/lib/generateRules.js +0 -951
  177. package/src/lib/getModuleDependencies.js +0 -79
  178. package/src/lib/load-config.ts +0 -39
  179. package/src/lib/normalizeTailwindDirectives.js +0 -84
  180. package/src/lib/offsets.js +0 -373
  181. package/src/lib/partitionApplyAtRules.js +0 -52
  182. package/src/lib/regex.js +0 -74
  183. package/src/lib/remap-bitfield.js +0 -82
  184. package/src/lib/resolveDefaultsAtRules.js +0 -163
  185. package/src/lib/setupContextUtils.js +0 -1366
  186. package/src/lib/setupTrackingContext.js +0 -169
  187. package/src/lib/sharedState.js +0 -61
  188. package/src/lib/substituteScreenAtRules.js +0 -19
  189. package/src/oxide/cli/build/deps.ts +0 -91
  190. package/src/oxide/cli/build/index.ts +0 -47
  191. package/src/oxide/cli/build/plugin.ts +0 -442
  192. package/src/oxide/cli/build/utils.ts +0 -74
  193. package/src/oxide/cli/build/watching.ts +0 -225
  194. package/src/oxide/cli/help/index.ts +0 -69
  195. package/src/oxide/cli/index.ts +0 -204
  196. package/src/oxide/cli/init/index.ts +0 -59
  197. package/src/oxide/cli.ts +0 -1
  198. package/src/oxide/postcss-plugin.ts +0 -1
  199. package/src/plugin.js +0 -107
  200. package/src/postcss-plugins/nesting/README.md +0 -42
  201. package/src/postcss-plugins/nesting/index.js +0 -13
  202. package/src/postcss-plugins/nesting/plugin.js +0 -80
  203. package/src/processTailwindFeatures.js +0 -59
  204. package/src/public/colors.js +0 -322
  205. package/src/public/create-plugin.js +0 -2
  206. package/src/public/default-config.js +0 -4
  207. package/src/public/default-theme.js +0 -4
  208. package/src/public/load-config.js +0 -2
  209. package/src/public/resolve-config.js +0 -7
  210. package/src/util/applyImportantSelector.js +0 -27
  211. package/src/util/bigSign.js +0 -3
  212. package/src/util/buildMediaQuery.js +0 -22
  213. package/src/util/cloneDeep.js +0 -11
  214. package/src/util/cloneNodes.js +0 -49
  215. package/src/util/color.js +0 -88
  216. package/src/util/colorNames.js +0 -150
  217. package/src/util/configurePlugins.js +0 -23
  218. package/src/util/createPlugin.js +0 -27
  219. package/src/util/createUtilityPlugin.js +0 -37
  220. package/src/util/dataTypes.js +0 -406
  221. package/src/util/defaults.js +0 -17
  222. package/src/util/escapeClassName.js +0 -8
  223. package/src/util/escapeCommas.js +0 -3
  224. package/src/util/flattenColorPalette.js +0 -13
  225. package/src/util/formatVariantSelector.js +0 -324
  226. package/src/util/getAllConfigs.js +0 -38
  227. package/src/util/hashConfig.js +0 -5
  228. package/src/util/isKeyframeRule.js +0 -3
  229. package/src/util/isPlainObject.js +0 -8
  230. package/src/util/isSyntacticallyValidPropertyValue.js +0 -61
  231. package/src/util/log.js +0 -29
  232. package/src/util/nameClass.js +0 -30
  233. package/src/util/negateValue.js +0 -24
  234. package/src/util/normalizeConfig.js +0 -301
  235. package/src/util/normalizeScreens.js +0 -140
  236. package/src/util/parseAnimationValue.js +0 -68
  237. package/src/util/parseBoxShadowValue.js +0 -72
  238. package/src/util/parseDependency.js +0 -44
  239. package/src/util/parseGlob.js +0 -24
  240. package/src/util/parseObjectStyles.js +0 -19
  241. package/src/util/pluginUtils.js +0 -307
  242. package/src/util/prefixSelector.js +0 -33
  243. package/src/util/pseudoElements.js +0 -171
  244. package/src/util/removeAlphaVariables.js +0 -24
  245. package/src/util/resolveConfig.js +0 -277
  246. package/src/util/resolveConfigPath.js +0 -66
  247. package/src/util/responsive.js +0 -10
  248. package/src/util/splitAtTopLevelOnly.js +0 -52
  249. package/src/util/tap.js +0 -4
  250. package/src/util/toColorValue.js +0 -3
  251. package/src/util/toPath.js +0 -26
  252. package/src/util/transformThemeValue.js +0 -62
  253. package/src/util/validateConfig.js +0 -26
  254. package/src/util/validateFormalSyntax.js +0 -34
  255. package/src/util/withAlphaVariable.js +0 -49
  256. package/src/value-parser/LICENSE +0 -22
  257. package/src/value-parser/README.md +0 -3
  258. package/src/value-parser/index.d.ts +0 -177
  259. package/src/value-parser/index.js +0 -28
  260. package/src/value-parser/parse.js +0 -303
  261. package/src/value-parser/stringify.js +0 -41
  262. package/src/value-parser/unit.js +0 -118
  263. package/src/value-parser/walk.js +0 -18
  264. package/stubs/.gitignore +0 -1
  265. package/stubs/.prettierrc.json +0 -6
  266. package/stubs/config.full.js +0 -1062
  267. package/stubs/config.simple.js +0 -7
  268. package/stubs/postcss.config.cjs +0 -6
  269. package/stubs/postcss.config.js +0 -6
  270. package/stubs/tailwind.config.cjs +0 -2
  271. package/stubs/tailwind.config.js +0 -2
  272. package/stubs/tailwind.config.ts +0 -3
  273. package/tailwind.css +0 -5
  274. package/types/config.d.ts +0 -376
  275. package/types/generated/.gitkeep +0 -0
  276. package/types/generated/colors.d.ts +0 -298
  277. package/types/generated/corePluginList.d.ts +0 -1
  278. package/types/generated/default-theme.d.ts +0 -397
  279. package/types/index.d.ts +0 -11
  280. package/variants.css +0 -1
@@ -1,951 +0,0 @@
1
- import postcss from 'postcss'
2
- import selectorParser from 'postcss-selector-parser'
3
- import parseObjectStyles from '../util/parseObjectStyles'
4
- import isPlainObject from '../util/isPlainObject'
5
- import prefixSelector from '../util/prefixSelector'
6
- import { updateAllClasses, getMatchingTypes } from '../util/pluginUtils'
7
- import log from '../util/log'
8
- import * as sharedState from './sharedState'
9
- import {
10
- formatVariantSelector,
11
- finalizeSelector,
12
- eliminateIrrelevantSelectors,
13
- } from '../util/formatVariantSelector'
14
- import { asClass } from '../util/nameClass'
15
- import { normalize } from '../util/dataTypes'
16
- import { isValidVariantFormatString, parseVariant, INTERNAL_FEATURES } from './setupContextUtils'
17
- import isValidArbitraryValue from '../util/isSyntacticallyValidPropertyValue'
18
- import { splitAtTopLevelOnly } from '../util/splitAtTopLevelOnly.js'
19
- import { flagEnabled } from '../featureFlags'
20
- import { applyImportantSelector } from '../util/applyImportantSelector'
21
-
22
- let classNameParser = selectorParser((selectors) => {
23
- return selectors.first.filter(({ type }) => type === 'class').pop().value
24
- })
25
-
26
- export function getClassNameFromSelector(selector) {
27
- return classNameParser.transformSync(selector)
28
- }
29
-
30
- // Generate match permutations for a class candidate, like:
31
- // ['ring-offset-blue', '100']
32
- // ['ring-offset', 'blue-100']
33
- // ['ring', 'offset-blue-100']
34
- // Example with dynamic classes:
35
- // ['grid-cols', '[[linename],1fr,auto]']
36
- // ['grid', 'cols-[[linename],1fr,auto]']
37
- function* candidatePermutations(candidate) {
38
- let lastIndex = Infinity
39
-
40
- while (lastIndex >= 0) {
41
- let dashIdx
42
- let wasSlash = false
43
-
44
- if (lastIndex === Infinity && candidate.endsWith(']')) {
45
- let bracketIdx = candidate.indexOf('[')
46
-
47
- // If character before `[` isn't a dash or a slash, this isn't a dynamic class
48
- // eg. string[]
49
- if (candidate[bracketIdx - 1] === '-') {
50
- dashIdx = bracketIdx - 1
51
- } else if (candidate[bracketIdx - 1] === '/') {
52
- dashIdx = bracketIdx - 1
53
- wasSlash = true
54
- } else {
55
- dashIdx = -1
56
- }
57
- } else if (lastIndex === Infinity && candidate.includes('/')) {
58
- dashIdx = candidate.lastIndexOf('/')
59
- wasSlash = true
60
- } else {
61
- dashIdx = candidate.lastIndexOf('-', lastIndex)
62
- }
63
-
64
- if (dashIdx < 0) {
65
- break
66
- }
67
-
68
- let prefix = candidate.slice(0, dashIdx)
69
- let modifier = candidate.slice(wasSlash ? dashIdx : dashIdx + 1)
70
-
71
- lastIndex = dashIdx - 1
72
-
73
- // TODO: This feels a bit hacky
74
- if (prefix === '' || modifier === '/') {
75
- continue
76
- }
77
-
78
- yield [prefix, modifier]
79
- }
80
- }
81
-
82
- function applyPrefix(matches, context) {
83
- if (matches.length === 0 || context.tailwindConfig.prefix === '') {
84
- return matches
85
- }
86
-
87
- for (let match of matches) {
88
- let [meta] = match
89
- if (meta.options.respectPrefix) {
90
- let container = postcss.root({ nodes: [match[1].clone()] })
91
- let classCandidate = match[1].raws.tailwind.classCandidate
92
-
93
- container.walkRules((r) => {
94
- // If this is a negative utility with a dash *before* the prefix we
95
- // have to ensure that the generated selector matches the candidate
96
-
97
- // Not doing this will cause `-tw-top-1` to generate the class `.tw--top-1`
98
- // The disconnect between candidate <-> class can cause @apply to hard crash.
99
- let shouldPrependNegative = classCandidate.startsWith('-')
100
-
101
- r.selector = prefixSelector(
102
- context.tailwindConfig.prefix,
103
- r.selector,
104
- shouldPrependNegative
105
- )
106
- })
107
-
108
- match[1] = container.nodes[0]
109
- }
110
- }
111
-
112
- return matches
113
- }
114
-
115
- function applyImportant(matches, classCandidate) {
116
- if (matches.length === 0) {
117
- return matches
118
- }
119
-
120
- let result = []
121
-
122
- function isInKeyframes(rule) {
123
- return rule.parent && rule.parent.type === 'atrule' && rule.parent.name === 'keyframes'
124
- }
125
-
126
- for (let [meta, rule] of matches) {
127
- let container = postcss.root({ nodes: [rule.clone()] })
128
-
129
- container.walkRules((r) => {
130
- // Declarations inside keyframes cannot be marked as important
131
- // They will be ignored by the browser
132
- if (isInKeyframes(r)) {
133
- return
134
- }
135
-
136
- let ast = selectorParser().astSync(r.selector)
137
-
138
- // Remove extraneous selectors that do not include the base candidate
139
- ast.each((sel) => eliminateIrrelevantSelectors(sel, classCandidate))
140
-
141
- // Update all instances of the base candidate to include the important marker
142
- updateAllClasses(ast, (className) =>
143
- className === classCandidate ? `!${className}` : className
144
- )
145
-
146
- r.selector = ast.toString()
147
-
148
- r.walkDecls((d) => (d.important = true))
149
- })
150
-
151
- result.push([{ ...meta, important: true }, container.nodes[0]])
152
- }
153
-
154
- return result
155
- }
156
-
157
- // Takes a list of rule tuples and applies a variant like `hover`, sm`,
158
- // whatever to it. We used to do some extra caching here to avoid generating
159
- // a variant of the same rule more than once, but this was never hit because
160
- // we cache at the entire selector level further up the tree.
161
- //
162
- // Technically you can get a cache hit if you have `hover:focus:text-center`
163
- // and `focus:hover:text-center` in the same project, but it doesn't feel
164
- // worth the complexity for that case.
165
-
166
- function applyVariant(variant, matches, context) {
167
- if (matches.length === 0) {
168
- return matches
169
- }
170
-
171
- /** @type {{modifier: string | null, value: string | null}} */
172
- let args = { modifier: null, value: sharedState.NONE }
173
-
174
- // Retrieve "modifier"
175
- {
176
- let [baseVariant, ...modifiers] = splitAtTopLevelOnly(variant, '/')
177
-
178
- // This is a hack to support variants with `/` in them, like `ar-1/10/20:text-red-500`
179
- // In this case 1/10 is a value but /20 is a modifier
180
- if (modifiers.length > 1) {
181
- baseVariant = baseVariant + '/' + modifiers.slice(0, -1).join('/')
182
- modifiers = modifiers.slice(-1)
183
- }
184
-
185
- if (modifiers.length && !context.variantMap.has(variant)) {
186
- variant = baseVariant
187
- args.modifier = modifiers[0]
188
-
189
- if (!flagEnabled(context.tailwindConfig, 'generalizedModifiers')) {
190
- return []
191
- }
192
- }
193
- }
194
-
195
- // Retrieve "arbitrary value"
196
- if (variant.endsWith(']') && !variant.startsWith('[')) {
197
- // We either have:
198
- // @[200px]
199
- // group-[:hover]
200
- //
201
- // But we don't want:
202
- // @-[200px] (`-` is incorrect)
203
- // group[:hover] (`-` is missing)
204
- let match = /(.)(-?)\[(.*)\]/g.exec(variant)
205
- if (match) {
206
- let [, char, separator, value] = match
207
- // @-[200px] case
208
- if (char === '@' && separator === '-') return []
209
- // group[:hover] case
210
- if (char !== '@' && separator === '') return []
211
-
212
- variant = variant.replace(`${separator}[${value}]`, '')
213
- args.value = value
214
- }
215
- }
216
-
217
- // Register arbitrary variants
218
- if (isArbitraryValue(variant) && !context.variantMap.has(variant)) {
219
- let sort = context.offsets.recordVariant(variant)
220
-
221
- let selector = normalize(variant.slice(1, -1))
222
- let selectors = splitAtTopLevelOnly(selector, ',')
223
-
224
- // We do not support multiple selectors for arbitrary variants
225
- if (selectors.length > 1) {
226
- return []
227
- }
228
-
229
- if (!selectors.every(isValidVariantFormatString)) {
230
- return []
231
- }
232
-
233
- let records = selectors.map((sel, idx) => [
234
- context.offsets.applyParallelOffset(sort, idx),
235
- parseVariant(sel.trim()),
236
- ])
237
-
238
- context.variantMap.set(variant, records)
239
- }
240
-
241
- if (context.variantMap.has(variant)) {
242
- let isArbitraryVariant = isArbitraryValue(variant)
243
- let internalFeatures = context.variantOptions.get(variant)?.[INTERNAL_FEATURES] ?? {}
244
- let variantFunctionTuples = context.variantMap.get(variant).slice()
245
- let result = []
246
-
247
- let respectPrefix = (() => {
248
- if (isArbitraryVariant) return false
249
- if (internalFeatures.respectPrefix === false) return false
250
- return true
251
- })()
252
-
253
- for (let [meta, rule] of matches) {
254
- // Don't generate variants for user css
255
- if (meta.layer === 'user') {
256
- continue
257
- }
258
-
259
- let container = postcss.root({ nodes: [rule.clone()] })
260
-
261
- for (let [variantSort, variantFunction, containerFromArray] of variantFunctionTuples) {
262
- let clone = (containerFromArray ?? container).clone()
263
- let collectedFormats = []
264
-
265
- function prepareBackup() {
266
- // Already prepared, chicken out
267
- if (clone.raws.neededBackup) {
268
- return
269
- }
270
- clone.raws.neededBackup = true
271
- clone.walkRules((rule) => (rule.raws.originalSelector = rule.selector))
272
- }
273
-
274
- function modifySelectors(modifierFunction) {
275
- prepareBackup()
276
- clone.each((rule) => {
277
- if (rule.type !== 'rule') {
278
- return
279
- }
280
-
281
- rule.selectors = rule.selectors.map((selector) => {
282
- return modifierFunction({
283
- get className() {
284
- return getClassNameFromSelector(selector)
285
- },
286
- selector,
287
- })
288
- })
289
- })
290
-
291
- return clone
292
- }
293
-
294
- let ruleWithVariant = variantFunction({
295
- // Public API
296
- get container() {
297
- prepareBackup()
298
- return clone
299
- },
300
- separator: context.tailwindConfig.separator,
301
- modifySelectors,
302
-
303
- // Private API for now
304
- wrap(wrapper) {
305
- let nodes = clone.nodes
306
- clone.removeAll()
307
- wrapper.append(nodes)
308
- clone.append(wrapper)
309
- },
310
- format(selectorFormat) {
311
- collectedFormats.push({
312
- format: selectorFormat,
313
- respectPrefix,
314
- })
315
- },
316
- args,
317
- })
318
-
319
- // It can happen that a list of format strings is returned from within the function. In that
320
- // case, we have to process them as well. We can use the existing `variantSort`.
321
- if (Array.isArray(ruleWithVariant)) {
322
- for (let [idx, variantFunction] of ruleWithVariant.entries()) {
323
- // This is a little bit scary since we are pushing to an array of items that we are
324
- // currently looping over. However, you can also think of it like a processing queue
325
- // where you keep handling jobs until everything is done and each job can queue more
326
- // jobs if needed.
327
- variantFunctionTuples.push([
328
- context.offsets.applyParallelOffset(variantSort, idx),
329
- variantFunction,
330
-
331
- // If the clone has been modified we have to pass that back
332
- // though so each rule can use the modified container
333
- clone.clone(),
334
- ])
335
- }
336
- continue
337
- }
338
-
339
- if (typeof ruleWithVariant === 'string') {
340
- collectedFormats.push({
341
- format: ruleWithVariant,
342
- respectPrefix,
343
- })
344
- }
345
-
346
- if (ruleWithVariant === null) {
347
- continue
348
- }
349
-
350
- // We had to backup selectors, therefore we assume that somebody touched
351
- // `container` or `modifySelectors`. Let's see if they did, so that we
352
- // can restore the selectors, and collect the format strings.
353
- if (clone.raws.neededBackup) {
354
- delete clone.raws.neededBackup
355
- clone.walkRules((rule) => {
356
- let before = rule.raws.originalSelector
357
- if (!before) return
358
- delete rule.raws.originalSelector
359
- if (before === rule.selector) return // No mutation happened
360
-
361
- let modified = rule.selector
362
-
363
- // Rebuild the base selector, this is what plugin authors would do
364
- // as well. E.g.: `${variant}${separator}${className}`.
365
- // However, plugin authors probably also prepend or append certain
366
- // classes, pseudos, ids, ...
367
- let rebuiltBase = selectorParser((selectors) => {
368
- selectors.walkClasses((classNode) => {
369
- classNode.value = `${variant}${context.tailwindConfig.separator}${classNode.value}`
370
- })
371
- }).processSync(before)
372
-
373
- // Now that we know the original selector, the new selector, and
374
- // the rebuild part in between, we can replace the part that plugin
375
- // authors need to rebuild with `&`, and eventually store it in the
376
- // collectedFormats. Similar to what `format('...')` would do.
377
- //
378
- // E.g.:
379
- // variant: foo
380
- // selector: .markdown > p
381
- // modified (by plugin): .foo .foo\\:markdown > p
382
- // rebuiltBase (internal): .foo\\:markdown > p
383
- // format: .foo &
384
- collectedFormats.push({
385
- format: modified.replace(rebuiltBase, '&'),
386
- respectPrefix,
387
- })
388
- rule.selector = before
389
- })
390
- }
391
-
392
- // This tracks the originating layer for the variant
393
- // For example:
394
- // .sm:underline {} is a variant of something in the utilities layer
395
- // .sm:container {} is a variant of the container component
396
- clone.nodes[0].raws.tailwind = { ...clone.nodes[0].raws.tailwind, parentLayer: meta.layer }
397
-
398
- let withOffset = [
399
- {
400
- ...meta,
401
- sort: context.offsets.applyVariantOffset(
402
- meta.sort,
403
- variantSort,
404
- Object.assign(args, context.variantOptions.get(variant))
405
- ),
406
- collectedFormats: (meta.collectedFormats ?? []).concat(collectedFormats),
407
- },
408
- clone.nodes[0],
409
- ]
410
- result.push(withOffset)
411
- }
412
- }
413
-
414
- return result
415
- }
416
-
417
- return []
418
- }
419
-
420
- function parseRules(rule, cache, options = {}) {
421
- // PostCSS node
422
- if (!isPlainObject(rule) && !Array.isArray(rule)) {
423
- return [[rule], options]
424
- }
425
-
426
- // Tuple
427
- if (Array.isArray(rule)) {
428
- return parseRules(rule[0], cache, rule[1])
429
- }
430
-
431
- // Simple object
432
- if (!cache.has(rule)) {
433
- cache.set(rule, parseObjectStyles(rule))
434
- }
435
-
436
- return [cache.get(rule), options]
437
- }
438
-
439
- const IS_VALID_PROPERTY_NAME = /^[a-z_-]/
440
-
441
- function isValidPropName(name) {
442
- return IS_VALID_PROPERTY_NAME.test(name)
443
- }
444
-
445
- /**
446
- * @param {string} declaration
447
- * @returns {boolean}
448
- */
449
- function looksLikeUri(declaration) {
450
- // Quick bailout for obvious non-urls
451
- // This doesn't support schemes that don't use a leading // but that's unlikely to be a problem
452
- if (!declaration.includes('://')) {
453
- return false
454
- }
455
-
456
- try {
457
- const url = new URL(declaration)
458
- return url.scheme !== '' && url.host !== ''
459
- } catch (err) {
460
- // Definitely not a valid url
461
- return false
462
- }
463
- }
464
-
465
- function isParsableNode(node) {
466
- let isParsable = true
467
-
468
- node.walkDecls((decl) => {
469
- if (!isParsableCssValue(decl.prop, decl.value)) {
470
- isParsable = false
471
- return false
472
- }
473
- })
474
-
475
- return isParsable
476
- }
477
-
478
- function isParsableCssValue(property, value) {
479
- // We don't want to to treat [https://example.com] as a custom property
480
- // Even though, according to the CSS grammar, it's a totally valid CSS declaration
481
- // So we short-circuit here by checking if the custom property looks like a url
482
- if (looksLikeUri(`${property}:${value}`)) {
483
- return false
484
- }
485
-
486
- try {
487
- postcss.parse(`a{${property}:${value}}`).toResult()
488
- return true
489
- } catch (err) {
490
- return false
491
- }
492
- }
493
-
494
- function extractArbitraryProperty(classCandidate, context) {
495
- let [, property, value] = classCandidate.match(/^\[([a-zA-Z0-9-_]+):(\S+)\]$/) ?? []
496
-
497
- if (value === undefined) {
498
- return null
499
- }
500
-
501
- if (!isValidPropName(property)) {
502
- return null
503
- }
504
-
505
- if (!isValidArbitraryValue(value)) {
506
- return null
507
- }
508
-
509
- let normalized = normalize(value, { property })
510
-
511
- if (!isParsableCssValue(property, normalized)) {
512
- return null
513
- }
514
-
515
- let sort = context.offsets.arbitraryProperty()
516
-
517
- return [
518
- [
519
- { sort, layer: 'utilities' },
520
- () => ({
521
- [asClass(classCandidate)]: {
522
- [property]: normalized,
523
- },
524
- }),
525
- ],
526
- ]
527
- }
528
-
529
- function* resolveMatchedPlugins(classCandidate, context) {
530
- if (context.candidateRuleMap.has(classCandidate)) {
531
- yield [context.candidateRuleMap.get(classCandidate), 'DEFAULT']
532
- }
533
-
534
- yield* (function* (arbitraryPropertyRule) {
535
- if (arbitraryPropertyRule !== null) {
536
- yield [arbitraryPropertyRule, 'DEFAULT']
537
- }
538
- })(extractArbitraryProperty(classCandidate, context))
539
-
540
- let candidatePrefix = classCandidate
541
- let negative = false
542
-
543
- const twConfigPrefix = context.tailwindConfig.prefix
544
-
545
- const twConfigPrefixLen = twConfigPrefix.length
546
-
547
- const hasMatchingPrefix =
548
- candidatePrefix.startsWith(twConfigPrefix) || candidatePrefix.startsWith(`-${twConfigPrefix}`)
549
-
550
- if (candidatePrefix[twConfigPrefixLen] === '-' && hasMatchingPrefix) {
551
- negative = true
552
- candidatePrefix = twConfigPrefix + candidatePrefix.slice(twConfigPrefixLen + 1)
553
- }
554
-
555
- if (negative && context.candidateRuleMap.has(candidatePrefix)) {
556
- yield [context.candidateRuleMap.get(candidatePrefix), '-DEFAULT']
557
- }
558
-
559
- for (let [prefix, modifier] of candidatePermutations(candidatePrefix)) {
560
- if (context.candidateRuleMap.has(prefix)) {
561
- yield [context.candidateRuleMap.get(prefix), negative ? `-${modifier}` : modifier]
562
- }
563
- }
564
- }
565
-
566
- function splitWithSeparator(input, separator) {
567
- if (input === sharedState.NOT_ON_DEMAND) {
568
- return [sharedState.NOT_ON_DEMAND]
569
- }
570
-
571
- return splitAtTopLevelOnly(input, separator)
572
- }
573
-
574
- function* recordCandidates(matches, classCandidate) {
575
- for (const match of matches) {
576
- match[1].raws.tailwind = {
577
- ...match[1].raws.tailwind,
578
- classCandidate,
579
- preserveSource: match[0].options?.preserveSource ?? false,
580
- }
581
-
582
- yield match
583
- }
584
- }
585
-
586
- function* resolveMatches(candidate, context) {
587
- let separator = context.tailwindConfig.separator
588
- let [classCandidate, ...variants] = splitWithSeparator(candidate, separator).reverse()
589
- let important = false
590
-
591
- if (classCandidate.startsWith('!')) {
592
- important = true
593
- classCandidate = classCandidate.slice(1)
594
- }
595
-
596
- // TODO: Reintroduce this in ways that doesn't break on false positives
597
- // function sortAgainst(toSort, against) {
598
- // return toSort.slice().sort((a, z) => {
599
- // return bigSign(against.get(a)[0] - against.get(z)[0])
600
- // })
601
- // }
602
- // let sorted = sortAgainst(variants, context.variantMap)
603
- // if (sorted.toString() !== variants.toString()) {
604
- // let corrected = sorted.reverse().concat(classCandidate).join(':')
605
- // throw new Error(`Class ${candidate} should be written as ${corrected}`)
606
- // }
607
-
608
- for (let matchedPlugins of resolveMatchedPlugins(classCandidate, context)) {
609
- let matches = []
610
- let typesByMatches = new Map()
611
-
612
- let [plugins, modifier] = matchedPlugins
613
- let isOnlyPlugin = plugins.length === 1
614
-
615
- for (let [sort, plugin] of plugins) {
616
- let matchesPerPlugin = []
617
-
618
- if (typeof plugin === 'function') {
619
- for (let ruleSet of [].concat(plugin(modifier, { isOnlyPlugin }))) {
620
- let [rules, options] = parseRules(ruleSet, context.postCssNodeCache)
621
- for (let rule of rules) {
622
- matchesPerPlugin.push([{ ...sort, options: { ...sort.options, ...options } }, rule])
623
- }
624
- }
625
- }
626
- // Only process static plugins on exact matches
627
- else if (modifier === 'DEFAULT' || modifier === '-DEFAULT') {
628
- let ruleSet = plugin
629
- let [rules, options] = parseRules(ruleSet, context.postCssNodeCache)
630
- for (let rule of rules) {
631
- matchesPerPlugin.push([{ ...sort, options: { ...sort.options, ...options } }, rule])
632
- }
633
- }
634
-
635
- if (matchesPerPlugin.length > 0) {
636
- let matchingTypes = Array.from(
637
- getMatchingTypes(
638
- sort.options?.types ?? [],
639
- modifier,
640
- sort.options ?? {},
641
- context.tailwindConfig
642
- )
643
- ).map(([_, type]) => type)
644
-
645
- if (matchingTypes.length > 0) {
646
- typesByMatches.set(matchesPerPlugin, matchingTypes)
647
- }
648
-
649
- matches.push(matchesPerPlugin)
650
- }
651
- }
652
-
653
- if (isArbitraryValue(modifier)) {
654
- if (matches.length > 1) {
655
- // Partition plugins in 2 categories so that we can start searching in the plugins that
656
- // don't have `any` as a type first.
657
- let [withAny, withoutAny] = matches.reduce(
658
- (group, plugin) => {
659
- let hasAnyType = plugin.some(([{ options }]) =>
660
- options.types.some(({ type }) => type === 'any')
661
- )
662
-
663
- if (hasAnyType) {
664
- group[0].push(plugin)
665
- } else {
666
- group[1].push(plugin)
667
- }
668
- return group
669
- },
670
- [[], []]
671
- )
672
-
673
- function findFallback(matches) {
674
- // If only a single plugin matches, let's take that one
675
- if (matches.length === 1) {
676
- return matches[0]
677
- }
678
-
679
- // Otherwise, find the plugin that creates a valid rule given the arbitrary value, and
680
- // also has the correct type which preferOnConflicts the plugin in case of clashes.
681
- return matches.find((rules) => {
682
- let matchingTypes = typesByMatches.get(rules)
683
- return rules.some(([{ options }, rule]) => {
684
- if (!isParsableNode(rule)) {
685
- return false
686
- }
687
-
688
- return options.types.some(
689
- ({ type, preferOnConflict }) => matchingTypes.includes(type) && preferOnConflict
690
- )
691
- })
692
- })
693
- }
694
-
695
- // Try to find a fallback plugin, because we already know that multiple plugins matched for
696
- // the given arbitrary value.
697
- let fallback = findFallback(withoutAny) ?? findFallback(withAny)
698
- if (fallback) {
699
- matches = [fallback]
700
- }
701
-
702
- // We couldn't find a fallback plugin which means that there are now multiple plugins that
703
- // generated css for the current candidate. This means that the result is ambiguous and this
704
- // should not happen. We won't generate anything right now, so let's report this to the user
705
- // by logging some options about what they can do.
706
- else {
707
- let typesPerPlugin = matches.map(
708
- (match) => new Set([...(typesByMatches.get(match) ?? [])])
709
- )
710
-
711
- // Remove duplicates, so that we can detect proper unique types for each plugin.
712
- for (let pluginTypes of typesPerPlugin) {
713
- for (let type of pluginTypes) {
714
- let removeFromOwnGroup = false
715
-
716
- for (let otherGroup of typesPerPlugin) {
717
- if (pluginTypes === otherGroup) continue
718
-
719
- if (otherGroup.has(type)) {
720
- otherGroup.delete(type)
721
- removeFromOwnGroup = true
722
- }
723
- }
724
-
725
- if (removeFromOwnGroup) pluginTypes.delete(type)
726
- }
727
- }
728
-
729
- let messages = []
730
-
731
- for (let [idx, group] of typesPerPlugin.entries()) {
732
- for (let type of group) {
733
- let rules = matches[idx]
734
- .map(([, rule]) => rule)
735
- .flat()
736
- .map((rule) =>
737
- rule
738
- .toString()
739
- .split('\n')
740
- .slice(1, -1) // Remove selector and closing '}'
741
- .map((line) => line.trim())
742
- .map((x) => ` ${x}`) // Re-indent
743
- .join('\n')
744
- )
745
- .join('\n\n')
746
-
747
- messages.push(
748
- ` Use \`${candidate.replace('[', `[${type}:`)}\` for \`${rules.trim()}\``
749
- )
750
- break
751
- }
752
- }
753
-
754
- log.warn([
755
- `The class \`${candidate}\` is ambiguous and matches multiple utilities.`,
756
- ...messages,
757
- `If this is content and not a class, replace it with \`${candidate
758
- .replace('[', '&lsqb;')
759
- .replace(']', '&rsqb;')}\` to silence this warning.`,
760
- ])
761
- continue
762
- }
763
- }
764
-
765
- matches = matches.map((list) => list.filter((match) => isParsableNode(match[1])))
766
- }
767
-
768
- matches = matches.flat()
769
- matches = Array.from(recordCandidates(matches, classCandidate))
770
- matches = applyPrefix(matches, context)
771
-
772
- if (important) {
773
- matches = applyImportant(matches, classCandidate)
774
- }
775
-
776
- for (let variant of variants) {
777
- matches = applyVariant(variant, matches, context)
778
- }
779
-
780
- for (let match of matches) {
781
- match[1].raws.tailwind = { ...match[1].raws.tailwind, candidate }
782
-
783
- // Apply final format selector
784
- match = applyFinalFormat(match, { context, candidate })
785
-
786
- // Skip rules with invalid selectors
787
- // This will cause the candidate to be added to the "not class"
788
- // cache skipping it entirely for future builds
789
- if (match === null) {
790
- continue
791
- }
792
-
793
- yield match
794
- }
795
- }
796
- }
797
-
798
- function applyFinalFormat(match, { context, candidate }) {
799
- if (!match[0].collectedFormats) {
800
- return match
801
- }
802
-
803
- let isValid = true
804
- let finalFormat
805
-
806
- try {
807
- finalFormat = formatVariantSelector(match[0].collectedFormats, {
808
- context,
809
- candidate,
810
- })
811
- } catch {
812
- // The format selector we produced is invalid
813
- // This could be because:
814
- // - A bug exists
815
- // - A plugin introduced an invalid variant selector (ex: `addVariant('foo', '&;foo')`)
816
- // - The user used an invalid arbitrary variant (ex: `[&;foo]:underline`)
817
- // Either way the build will fail because of this
818
- // We would rather that the build pass "silently" given that this could
819
- // happen because of picking up invalid things when scanning content
820
- // So we'll throw out the candidate instead
821
-
822
- return null
823
- }
824
-
825
- let container = postcss.root({ nodes: [match[1].clone()] })
826
-
827
- container.walkRules((rule) => {
828
- if (inKeyframes(rule)) {
829
- return
830
- }
831
-
832
- try {
833
- let selector = finalizeSelector(rule.selector, finalFormat, {
834
- candidate,
835
- context,
836
- })
837
-
838
- // Finalize Selector determined that this candidate is irrelevant
839
- // TODO: This elimination should happen earlier so this never happens
840
- if (selector === null) {
841
- rule.remove()
842
- return
843
- }
844
-
845
- rule.selector = selector
846
- } catch {
847
- // If this selector is invalid we also want to skip it
848
- // But it's likely that being invalid here means there's a bug in a plugin rather than too loosely matching content
849
- isValid = false
850
- return false
851
- }
852
- })
853
-
854
- if (!isValid) {
855
- return null
856
- }
857
-
858
- // If all rules have been eliminated we can skip this candidate entirely
859
- if (container.nodes.length === 0) {
860
- return null
861
- }
862
-
863
- match[1] = container.nodes[0]
864
-
865
- return match
866
- }
867
-
868
- function inKeyframes(rule) {
869
- return rule.parent && rule.parent.type === 'atrule' && rule.parent.name === 'keyframes'
870
- }
871
-
872
- function getImportantStrategy(important) {
873
- if (important === true) {
874
- return (rule) => {
875
- if (inKeyframes(rule)) {
876
- return
877
- }
878
-
879
- rule.walkDecls((d) => {
880
- if (d.parent.type === 'rule' && !inKeyframes(d.parent)) {
881
- d.important = true
882
- }
883
- })
884
- }
885
- }
886
-
887
- if (typeof important === 'string') {
888
- return (rule) => {
889
- if (inKeyframes(rule)) {
890
- return
891
- }
892
-
893
- rule.selectors = rule.selectors.map((selector) => {
894
- return applyImportantSelector(selector, important)
895
- })
896
- }
897
- }
898
- }
899
-
900
- function generateRules(candidates, context, isSorting = false) {
901
- let allRules = []
902
- let strategy = getImportantStrategy(context.tailwindConfig.important)
903
-
904
- for (let candidate of candidates) {
905
- if (context.notClassCache.has(candidate)) {
906
- continue
907
- }
908
-
909
- if (context.candidateRuleCache.has(candidate)) {
910
- allRules = allRules.concat(Array.from(context.candidateRuleCache.get(candidate)))
911
- continue
912
- }
913
-
914
- let matches = Array.from(resolveMatches(candidate, context))
915
-
916
- if (matches.length === 0) {
917
- context.notClassCache.add(candidate)
918
- continue
919
- }
920
-
921
- context.classCache.set(candidate, matches)
922
-
923
- let rules = context.candidateRuleCache.get(candidate) ?? new Set()
924
- context.candidateRuleCache.set(candidate, rules)
925
-
926
- for (const match of matches) {
927
- let [{ sort, options }, rule] = match
928
-
929
- if (options.respectImportant && strategy) {
930
- let container = postcss.root({ nodes: [rule.clone()] })
931
- container.walkRules(strategy)
932
- rule = container.nodes[0]
933
- }
934
-
935
- // Note: We have to clone rules during sorting
936
- // so we eliminate some shared mutable state
937
- let newEntry = [sort, isSorting ? rule.clone() : rule]
938
- rules.add(newEntry)
939
- context.ruleCache.add(newEntry)
940
- allRules.push(newEntry)
941
- }
942
- }
943
-
944
- return allRules
945
- }
946
-
947
- function isArbitraryValue(input) {
948
- return input.startsWith('[') && input.endsWith(']')
949
- }
950
-
951
- export { resolveMatches, generateRules }