tailwindcss 3.4.1 → 3.4.3

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 (64) hide show
  1. package/CHANGELOG.md +29 -2
  2. package/README.md +2 -3
  3. package/lib/cli/build/plugin.js +4 -11
  4. package/lib/cli.js +1 -5
  5. package/lib/corePluginList.js +1 -0
  6. package/lib/corePlugins.js +50 -21
  7. package/lib/css/preflight.css +4 -3
  8. package/lib/featureFlags.js +2 -6
  9. package/lib/lib/defaultExtractor.js +2 -2
  10. package/lib/lib/expandApplyAtRules.js +13 -0
  11. package/lib/lib/expandTailwindAtRules.js +20 -32
  12. package/lib/lib/generateRules.js +5 -2
  13. package/lib/lib/load-config.js +4 -0
  14. package/lib/lib/offsets.js +51 -2
  15. package/lib/lib/resolveDefaultsAtRules.js +3 -1
  16. package/lib/lib/setupContextUtils.js +5 -1
  17. package/lib/lib/sharedState.js +2 -10
  18. package/lib/plugin.js +0 -50
  19. package/lib/processTailwindFeatures.js +0 -2
  20. package/lib/util/dataTypes.js +1 -1
  21. package/package.json +5 -8
  22. package/peers/index.js +61 -61
  23. package/src/cli/build/plugin.js +4 -11
  24. package/src/cli.js +1 -5
  25. package/src/corePluginList.js +1 -1
  26. package/src/corePlugins.js +45 -23
  27. package/src/css/preflight.css +4 -3
  28. package/src/featureFlags.js +2 -6
  29. package/src/lib/defaultExtractor.js +2 -2
  30. package/src/lib/expandApplyAtRules.js +17 -0
  31. package/src/lib/expandTailwindAtRules.js +23 -41
  32. package/src/lib/generateRules.js +2 -2
  33. package/src/lib/load-config.ts +5 -0
  34. package/src/lib/offsets.js +61 -2
  35. package/src/lib/resolveDefaultsAtRules.js +5 -1
  36. package/src/lib/setupContextUtils.js +6 -1
  37. package/src/lib/sharedState.js +0 -4
  38. package/src/plugin.js +0 -60
  39. package/src/processTailwindFeatures.js +0 -3
  40. package/src/util/dataTypes.js +1 -1
  41. package/types/generated/corePluginList.d.ts +1 -1
  42. package/lib/lib/detectNesting.js +0 -45
  43. package/lib/oxide/cli/build/deps.js +0 -89
  44. package/lib/oxide/cli/build/index.js +0 -53
  45. package/lib/oxide/cli/build/plugin.js +0 -375
  46. package/lib/oxide/cli/build/utils.js +0 -87
  47. package/lib/oxide/cli/build/watching.js +0 -179
  48. package/lib/oxide/cli/help/index.js +0 -72
  49. package/lib/oxide/cli/index.js +0 -214
  50. package/lib/oxide/cli/init/index.js +0 -52
  51. package/lib/oxide/cli.js +0 -5
  52. package/lib/oxide/postcss-plugin.js +0 -2
  53. package/scripts/swap-engines.js +0 -40
  54. package/src/lib/detectNesting.js +0 -47
  55. package/src/oxide/cli/build/deps.ts +0 -91
  56. package/src/oxide/cli/build/index.ts +0 -47
  57. package/src/oxide/cli/build/plugin.ts +0 -442
  58. package/src/oxide/cli/build/utils.ts +0 -74
  59. package/src/oxide/cli/build/watching.ts +0 -225
  60. package/src/oxide/cli/help/index.ts +0 -69
  61. package/src/oxide/cli/index.ts +0 -204
  62. package/src/oxide/cli/init/index.ts +0 -59
  63. package/src/oxide/cli.ts +0 -1
  64. package/src/oxide/postcss-plugin.ts +0 -1
@@ -1,91 +0,0 @@
1
- import packageJson from '../../../../package.json'
2
- import browserslist from 'browserslist'
3
- import { Result } from 'postcss'
4
-
5
- import {
6
- // @ts-ignore
7
- lazyPostcss,
8
-
9
- // @ts-ignore
10
- lazyPostcssImport,
11
-
12
- // @ts-ignore
13
- lazyCssnano,
14
-
15
- // @ts-ignore
16
- } from '../../../../peers/index'
17
-
18
- export function lazyLightningCss() {
19
- // TODO: Make this lazy/bundled
20
- return require('lightningcss')
21
- }
22
-
23
- let lightningCss
24
-
25
- function loadLightningCss() {
26
- if (lightningCss) {
27
- return lightningCss
28
- }
29
-
30
- // Try to load a local version first
31
- try {
32
- return (lightningCss = require('lightningcss'))
33
- } catch {}
34
-
35
- return (lightningCss = lazyLightningCss())
36
- }
37
-
38
- export async function lightningcss(shouldMinify: boolean, result: Result) {
39
- let css = loadLightningCss()
40
-
41
- try {
42
- let transformed = css.transform({
43
- filename: result.opts.from || 'input.css',
44
- code: Buffer.from(result.css, 'utf-8'),
45
- minify: shouldMinify,
46
- sourceMap: !!result.map,
47
- inputSourceMap: result.map ? result.map.toString() : undefined,
48
- targets: css.browserslistToTargets(browserslist(packageJson.browserslist)),
49
- drafts: {
50
- nesting: true,
51
- },
52
- })
53
-
54
- return Object.assign(result, {
55
- css: transformed.code.toString('utf8'),
56
- map: result.map
57
- ? Object.assign(result.map, {
58
- toString() {
59
- return transformed.map.toString()
60
- },
61
- })
62
- : result.map,
63
- })
64
- } catch (err) {
65
- console.error('Unable to use Lightning CSS. Using raw version instead.')
66
- console.error(err)
67
-
68
- return result
69
- }
70
- }
71
-
72
- /**
73
- * @returns {import('postcss')}
74
- */
75
- export function loadPostcss() {
76
- // Try to load a local `postcss` version first
77
- try {
78
- return require('postcss')
79
- } catch {}
80
-
81
- return lazyPostcss()
82
- }
83
-
84
- export function loadPostcssImport() {
85
- // Try to load a local `postcss-import` version first
86
- try {
87
- return require('postcss-import')
88
- } catch {}
89
-
90
- return lazyPostcssImport()
91
- }
@@ -1,47 +0,0 @@
1
- import fs from 'fs'
2
- import path from 'path'
3
- import { resolveDefaultConfigPath } from '../../../util/resolveConfigPath'
4
- import { createProcessor } from './plugin'
5
-
6
- export async function build(args) {
7
- let input = args['--input']
8
- let shouldWatch = args['--watch']
9
-
10
- // TODO: Deprecate this in future versions
11
- if (!input && args['_'][1]) {
12
- console.error('[deprecation] Running tailwindcss without -i, please provide an input file.')
13
- input = args['--input'] = args['_'][1]
14
- }
15
-
16
- if (input && input !== '-' && !fs.existsSync((input = path.resolve(input)))) {
17
- console.error(`Specified input file ${args['--input']} does not exist.`)
18
- process.exit(9)
19
- }
20
-
21
- if (args['--config'] && !fs.existsSync((args['--config'] = path.resolve(args['--config'])))) {
22
- console.error(`Specified config file ${args['--config']} does not exist.`)
23
- process.exit(9)
24
- }
25
-
26
- // TODO: Reference the @config path here if exists
27
- let configPath = args['--config'] ? args['--config'] : resolveDefaultConfigPath()
28
-
29
- let processor = await createProcessor(args, configPath)
30
-
31
- if (shouldWatch) {
32
- // Abort the watcher if stdin is closed to avoid zombie processes
33
- // You can disable this behavior with --watch=always
34
- if (args['--watch'] !== 'always') {
35
- process.stdin.on('end', () => process.exit(0))
36
- }
37
-
38
- process.stdin.resume()
39
-
40
- await processor.watch()
41
- } else {
42
- await processor.build().catch((e) => {
43
- console.error(e)
44
- process.exit(1)
45
- })
46
- }
47
- }
@@ -1,442 +0,0 @@
1
- import path from 'path'
2
- import fs from 'fs'
3
- import postcssrc from 'postcss-load-config'
4
- import { lilconfig } from 'lilconfig'
5
- import loadPlugins from 'postcss-load-config/src/plugins' // Little bit scary, looking at private/internal API
6
- import loadOptions from 'postcss-load-config/src/options' // Little bit scary, looking at private/internal API
7
-
8
- import tailwind from '../../../processTailwindFeatures'
9
- import { loadPostcss, loadPostcssImport, lightningcss } from './deps'
10
- import { formatNodes, drainStdin, outputFile } from './utils'
11
- import { env } from '../../../lib/sharedState'
12
- import resolveConfig from '../../../../resolveConfig'
13
- import { parseCandidateFiles } from '../../../lib/content'
14
- import { createWatcher } from './watching'
15
- import fastGlob from 'fast-glob'
16
- import { findAtConfigPath } from '../../../lib/findAtConfigPath'
17
- import log from '../../../util/log'
18
- import { loadConfig } from '../../../lib/load-config'
19
- import getModuleDependencies from '../../../lib/getModuleDependencies'
20
- import type { Config } from '../../../../types'
21
-
22
- /**
23
- *
24
- * @param {string} [customPostCssPath ]
25
- * @returns
26
- */
27
- async function loadPostCssPlugins(customPostCssPath) {
28
- let config = customPostCssPath
29
- ? await (async () => {
30
- let file = path.resolve(customPostCssPath)
31
-
32
- // Implementation, see: https://unpkg.com/browse/postcss-load-config@3.1.0/src/index.js
33
- // @ts-ignore
34
- let { config = {} } = await lilconfig('postcss').load(file)
35
- if (typeof config === 'function') {
36
- config = config()
37
- } else {
38
- config = Object.assign({}, config)
39
- }
40
-
41
- if (!config.plugins) {
42
- config.plugins = []
43
- }
44
-
45
- return {
46
- file,
47
- plugins: loadPlugins(config, file),
48
- options: loadOptions(config, file),
49
- }
50
- })()
51
- : await postcssrc()
52
-
53
- let configPlugins = config.plugins
54
-
55
- let configPluginTailwindIdx = configPlugins.findIndex((plugin) => {
56
- if (typeof plugin === 'function' && plugin.name === 'tailwindcss') {
57
- return true
58
- }
59
-
60
- if (typeof plugin === 'object' && plugin !== null && plugin.postcssPlugin === 'tailwindcss') {
61
- return true
62
- }
63
-
64
- return false
65
- })
66
-
67
- let beforePlugins =
68
- configPluginTailwindIdx === -1 ? [] : configPlugins.slice(0, configPluginTailwindIdx)
69
- let afterPlugins =
70
- configPluginTailwindIdx === -1
71
- ? configPlugins
72
- : configPlugins.slice(configPluginTailwindIdx + 1)
73
-
74
- return [beforePlugins, afterPlugins, config.options]
75
- }
76
-
77
- function loadBuiltinPostcssPlugins() {
78
- let postcss = loadPostcss()
79
- let IMPORT_COMMENT = '__TAILWIND_RESTORE_IMPORT__: '
80
- return [
81
- [
82
- (root) => {
83
- root.walkAtRules('import', (rule) => {
84
- if (rule.params.slice(1).startsWith('tailwindcss/')) {
85
- rule.after(postcss.comment({ text: IMPORT_COMMENT + rule.params }))
86
- rule.remove()
87
- }
88
- })
89
- },
90
- loadPostcssImport(),
91
- (root) => {
92
- root.walkComments((rule) => {
93
- if (rule.text.startsWith(IMPORT_COMMENT)) {
94
- rule.after(
95
- postcss.atRule({
96
- name: 'import',
97
- params: rule.text.replace(IMPORT_COMMENT, ''),
98
- })
99
- )
100
- rule.remove()
101
- }
102
- })
103
- },
104
- ],
105
- [],
106
- {},
107
- ]
108
- }
109
-
110
- let state = {
111
- /** @type {any} */
112
- context: null,
113
-
114
- /** @type {ReturnType<typeof createWatcher> | null} */
115
- watcher: null,
116
-
117
- /** @type {{content: string, extension: string}[]} */
118
- changedContent: [],
119
-
120
- /** @type {{config: Config, dependencies: Set<string>, dispose: Function } | null} */
121
- configBag: null,
122
-
123
- contextDependencies: new Set(),
124
-
125
- /** @type {import('../../lib/content.js').ContentPath[]} */
126
- contentPaths: [],
127
-
128
- refreshContentPaths() {
129
- this.contentPaths = parseCandidateFiles(this.context, this.context?.tailwindConfig)
130
- },
131
-
132
- get config() {
133
- return this.context.tailwindConfig
134
- },
135
-
136
- get contentPatterns() {
137
- return {
138
- all: this.contentPaths.map((contentPath) => contentPath.pattern),
139
- dynamic: this.contentPaths
140
- .filter((contentPath) => contentPath.glob !== undefined)
141
- .map((contentPath) => contentPath.pattern),
142
- }
143
- },
144
-
145
- loadConfig(configPath, content) {
146
- if (this.watcher && configPath) {
147
- this.refreshConfigDependencies()
148
- }
149
-
150
- let config = loadConfig(configPath)
151
- let dependencies = getModuleDependencies(configPath)
152
- this.configBag = {
153
- config,
154
- dependencies,
155
- dispose() {
156
- for (let file of dependencies) {
157
- delete require.cache[require.resolve(file)]
158
- }
159
- },
160
- }
161
-
162
- // @ts-ignore
163
- this.configBag.config = resolveConfig(this.configBag.config, { content: { files: [] } })
164
-
165
- // Override content files if `--content` has been passed explicitly
166
- if (content?.length > 0) {
167
- this.configBag.config.content.files = content
168
- }
169
-
170
- return this.configBag.config
171
- },
172
-
173
- refreshConfigDependencies(configPath) {
174
- env.DEBUG && console.time('Module dependencies')
175
- this.configBag?.dispose()
176
- env.DEBUG && console.timeEnd('Module dependencies')
177
- },
178
-
179
- readContentPaths() {
180
- let content = []
181
-
182
- // Resolve globs from the content config
183
- // TODO: When we make the postcss plugin async-capable this can become async
184
- let files = fastGlob.sync(this.contentPatterns.all)
185
-
186
- for (let file of files) {
187
- if (__OXIDE__) {
188
- content.push({
189
- file,
190
- extension: path.extname(file).slice(1),
191
- })
192
- } else {
193
- content.push({
194
- content: fs.readFileSync(path.resolve(file), 'utf8'),
195
- extension: path.extname(file).slice(1),
196
- })
197
- }
198
- }
199
-
200
- // Resolve raw content in the tailwind config
201
- let rawContent = this.config.content.files.filter((file) => {
202
- return file !== null && typeof file === 'object'
203
- })
204
-
205
- for (let { raw: htmlContent, extension = 'html' } of rawContent) {
206
- content.push({ content: htmlContent, extension })
207
- }
208
-
209
- return content
210
- },
211
-
212
- getContext({ createContext, cliConfigPath, root, result, content }) {
213
- env.DEBUG && console.time('Searching for config')
214
- let configPath = findAtConfigPath(root, result) ?? cliConfigPath
215
- env.DEBUG && console.timeEnd('Searching for config')
216
-
217
- if (this.context) {
218
- this.context.changedContent = this.changedContent.splice(0)
219
-
220
- return this.context
221
- }
222
-
223
- env.DEBUG && console.time('Loading config')
224
- let config = this.loadConfig(configPath, content)
225
- env.DEBUG && console.timeEnd('Loading config')
226
-
227
- env.DEBUG && console.time('Creating context')
228
- this.context = createContext(config, [])
229
- Object.assign(this.context, {
230
- userConfigPath: configPath,
231
- })
232
- env.DEBUG && console.timeEnd('Creating context')
233
-
234
- env.DEBUG && console.time('Resolving content paths')
235
- this.refreshContentPaths()
236
- env.DEBUG && console.timeEnd('Resolving content paths')
237
-
238
- if (this.watcher) {
239
- env.DEBUG && console.time('Watch new files')
240
- this.watcher.refreshWatchedFiles()
241
- env.DEBUG && console.timeEnd('Watch new files')
242
- }
243
-
244
- for (let file of this.readContentPaths()) {
245
- this.context.changedContent.push(file)
246
- }
247
-
248
- return this.context
249
- },
250
- }
251
-
252
- export async function createProcessor(args, cliConfigPath) {
253
- let postcss = loadPostcss()
254
-
255
- let input = args['--input']
256
- let output = args['--output']
257
- let includePostCss = args['--postcss']
258
- let customPostCssPath = typeof args['--postcss'] === 'string' ? args['--postcss'] : undefined
259
-
260
- let [beforePlugins, afterPlugins, postcssOptions] = includePostCss
261
- ? await loadPostCssPlugins(customPostCssPath)
262
- : loadBuiltinPostcssPlugins()
263
-
264
- if (args['--purge']) {
265
- log.warn('purge-flag-deprecated', [
266
- 'The `--purge` flag has been deprecated.',
267
- 'Please use `--content` instead.',
268
- ])
269
-
270
- if (!args['--content']) {
271
- args['--content'] = args['--purge']
272
- }
273
- }
274
-
275
- let content = args['--content']?.split(/(?<!{[^}]+),/) ?? []
276
-
277
- let tailwindPlugin = () => {
278
- return {
279
- postcssPlugin: 'tailwindcss',
280
- async Once(root, { result }) {
281
- env.DEBUG && console.time('Compiling CSS')
282
- await tailwind(({ createContext }) => {
283
- console.error()
284
- console.error('Rebuilding...')
285
-
286
- return () => {
287
- return state.getContext({
288
- createContext,
289
- cliConfigPath,
290
- root,
291
- result,
292
- content,
293
- })
294
- }
295
- })(root, result)
296
- env.DEBUG && console.timeEnd('Compiling CSS')
297
- },
298
- }
299
- }
300
-
301
- tailwindPlugin.postcss = true
302
-
303
- let plugins = [
304
- ...beforePlugins,
305
- tailwindPlugin,
306
- !args['--minify'] && formatNodes,
307
- ...afterPlugins,
308
- ].filter(Boolean)
309
-
310
- /** @type {import('postcss').Processor} */
311
- // @ts-ignore
312
- let processor = postcss(plugins)
313
-
314
- async function readInput() {
315
- // Piping in data, let's drain the stdin
316
- if (input === '-') {
317
- return drainStdin()
318
- }
319
-
320
- // Input file has been provided
321
- if (input) {
322
- return fs.promises.readFile(path.resolve(input), 'utf8')
323
- }
324
-
325
- // No input file provided, fallback to default atrules
326
- return '@tailwind base; @tailwind components; @tailwind utilities'
327
- }
328
-
329
- async function build() {
330
- let start = process.hrtime.bigint()
331
-
332
- return readInput()
333
- .then((css) => processor.process(css, { ...postcssOptions, from: input, to: output }))
334
- .then((result) => lightningcss(!!args['--minify'], result))
335
- .then((result) => {
336
- if (!state.watcher) {
337
- return result
338
- }
339
-
340
- env.DEBUG && console.time('Recording PostCSS dependencies')
341
- for (let message of result.messages) {
342
- if (message.type === 'dependency') {
343
- state.contextDependencies.add(message.file)
344
- }
345
- }
346
- env.DEBUG && console.timeEnd('Recording PostCSS dependencies')
347
-
348
- // TODO: This needs to be in a different spot
349
- env.DEBUG && console.time('Watch new files')
350
- state.watcher.refreshWatchedFiles()
351
- env.DEBUG && console.timeEnd('Watch new files')
352
-
353
- return result
354
- })
355
- .then((result) => {
356
- if (!output) {
357
- process.stdout.write(result.css)
358
- return
359
- }
360
-
361
- return Promise.all([
362
- outputFile(result.opts.to, result.css),
363
- result.map && outputFile(result.opts.to + '.map', result.map.toString()),
364
- ])
365
- })
366
- .then(() => {
367
- let end = process.hrtime.bigint()
368
- console.error()
369
- console.error('Done in', (end - start) / BigInt(1e6) + 'ms.')
370
- })
371
- .then(
372
- () => {},
373
- (err) => {
374
- // TODO: If an initial build fails we can't easily pick up any PostCSS dependencies
375
- // that were collected before the error occurred
376
- // The result is not stored on the error so we have to store it externally
377
- // and pull the messages off of it here somehow
378
-
379
- // This results in a less than ideal DX because the watcher will not pick up
380
- // changes to imported CSS if one of them caused an error during the initial build
381
- // If you fix it and then save the main CSS file so there's no error
382
- // The watcher will start watching the imported CSS files and will be
383
- // resilient to future errors.
384
-
385
- if (state.watcher) {
386
- console.error(err)
387
- } else {
388
- return Promise.reject(err)
389
- }
390
- }
391
- )
392
- }
393
-
394
- /**
395
- * @param {{file: string, content(): Promise<string>, extension: string}[]} changes
396
- */
397
- async function parseChanges(changes) {
398
- return Promise.all(
399
- changes.map(async (change) => ({
400
- content: await change.content(),
401
- extension: change.extension,
402
- }))
403
- )
404
- }
405
-
406
- if (input !== undefined && input !== '-') {
407
- state.contextDependencies.add(path.resolve(input))
408
- }
409
-
410
- return {
411
- build,
412
- watch: async () => {
413
- state.watcher = createWatcher(args, {
414
- state,
415
-
416
- /**
417
- * @param {{file: string, content(): Promise<string>, extension: string}[]} changes
418
- */
419
- async rebuild(changes) {
420
- let needsNewContext = changes.some((change) => {
421
- return (
422
- state.configBag?.dependencies.has(change.file) ||
423
- state.contextDependencies.has(change.file)
424
- )
425
- })
426
-
427
- if (needsNewContext) {
428
- state.context = null
429
- } else {
430
- for (let change of await parseChanges(changes)) {
431
- state.changedContent.push(change)
432
- }
433
- }
434
-
435
- return build()
436
- },
437
- })
438
-
439
- await build()
440
- },
441
- }
442
- }
@@ -1,74 +0,0 @@
1
- import fs from 'fs'
2
- import path from 'path'
3
-
4
- export function indentRecursive(node, indent = 0) {
5
- node.each &&
6
- node.each((child, i) => {
7
- if (!child.raws.before || !child.raws.before.trim() || child.raws.before.includes('\n')) {
8
- child.raws.before = `\n${node.type !== 'rule' && i > 0 ? '\n' : ''}${' '.repeat(indent)}`
9
- }
10
- child.raws.after = `\n${' '.repeat(indent)}`
11
- indentRecursive(child, indent + 1)
12
- })
13
- }
14
-
15
- export function formatNodes(root) {
16
- indentRecursive(root)
17
- if (root.first) {
18
- root.first.raws.before = ''
19
- }
20
- }
21
-
22
- /**
23
- * When rapidly saving files atomically a couple of situations can happen:
24
- * - The file is missing since the external program has deleted it by the time we've gotten around to reading it from the earlier save.
25
- * - The file is being written to by the external program by the time we're going to read it and is thus treated as busy because a lock is held.
26
- *
27
- * To work around this we retry reading the file a handful of times with a delay between each attempt
28
- *
29
- * @param {string} path
30
- * @param {number} tries
31
- * @returns {Promise<string | undefined>}
32
- * @throws {Error} If the file is still missing or busy after the specified number of tries
33
- */
34
- export async function readFileWithRetries(path, tries = 5) {
35
- for (let n = 0; n <= tries; n++) {
36
- try {
37
- return await fs.promises.readFile(path, 'utf8')
38
- } catch (err) {
39
- if (n !== tries) {
40
- if (err.code === 'ENOENT' || err.code === 'EBUSY') {
41
- await new Promise((resolve) => setTimeout(resolve, 10))
42
-
43
- continue
44
- }
45
- }
46
-
47
- throw err
48
- }
49
- }
50
- }
51
-
52
- export function drainStdin() {
53
- return new Promise((resolve, reject) => {
54
- let result = ''
55
- process.stdin.on('data', (chunk) => {
56
- result += chunk
57
- })
58
- process.stdin.on('end', () => resolve(result))
59
- process.stdin.on('error', (err) => reject(err))
60
- })
61
- }
62
-
63
- export async function outputFile(file, newContents) {
64
- try {
65
- let currentContents = await fs.promises.readFile(file, 'utf8')
66
- if (currentContents === newContents) {
67
- return // Skip writing the file
68
- }
69
- } catch {}
70
-
71
- // Write the file
72
- await fs.promises.mkdir(path.dirname(file), { recursive: true })
73
- await fs.promises.writeFile(file, newContents, 'utf8')
74
- }