tailwindcss 3.4.0 → 4.0.0-alpha.1

package/src/lib/expandTailwindAtRules.js

@@ -1,300 +0,0 @@
-import fs from 'fs'
-import LRU from '@alloc/quick-lru'
-import * as sharedState from './sharedState'
-import { generateRules } from './generateRules'
-import log from '../util/log'
-import cloneNodes from '../util/cloneNodes'
-import { defaultExtractor } from './defaultExtractor'
-
-let env = sharedState.env
-
-const builtInExtractors = {
-  DEFAULT: defaultExtractor,
-}
-
-const builtInTransformers = {
-  DEFAULT: (content) => content,
-  svelte: (content) => content.replace(/(?:^|\s)class:/g, ' '),
-}
-
-function getExtractor(context, fileExtension) {
-  let extractors = context.tailwindConfig.content.extract
-
-  return (
-    extractors[fileExtension] ||
-    extractors.DEFAULT ||
-    builtInExtractors[fileExtension] ||
-    builtInExtractors.DEFAULT(context)
-  )
-}
-
-function getTransformer(tailwindConfig, fileExtension) {
-  let transformers = tailwindConfig.content.transform
-
-  return (
-    transformers[fileExtension] ||
-    transformers.DEFAULT ||
-    builtInTransformers[fileExtension] ||
-    builtInTransformers.DEFAULT
-  )
-}
-
-let extractorCache = new WeakMap()
-
-// Scans template contents for possible classes. This is a hot path on initial build but
-// not too important for subsequent builds. The faster the better though — if we can speed
-// up these regexes by 50% that could cut initial build time by like 20%.
-function getClassCandidates(content, extractor, candidates, seen) {
-  if (!extractorCache.has(extractor)) {
-    extractorCache.set(extractor, new LRU({ maxSize: 25000 }))
-  }
-
-  for (let line of content.split('\n')) {
-    line = line.trim()
-
-    if (seen.has(line)) {
-      continue
-    }
-    seen.add(line)
-
-    if (extractorCache.get(extractor).has(line)) {
-      for (let match of extractorCache.get(extractor).get(line)) {
-        candidates.add(match)
-      }
-    } else {
-      let extractorMatches = extractor(line).filter((s) => s !== '!*')
-      let lineMatchesSet = new Set(extractorMatches)
-
-      for (let match of lineMatchesSet) {
-        candidates.add(match)
-      }
-
-      extractorCache.get(extractor).set(line, lineMatchesSet)
-    }
-  }
-}
-
-/**
- *
- * @param {[import('./offsets.js').RuleOffset, import('postcss').Node][]} rules
- * @param {*} context
- */
-function buildStylesheet(rules, context) {
-  let sortedRules = context.offsets.sort(rules)
-
-  let returnValue = {
-    base: new Set(),
-    defaults: new Set(),
-    components: new Set(),
-    utilities: new Set(),
-    variants: new Set(),
-  }
-
-  for (let [sort, rule] of sortedRules) {
-    returnValue[sort.layer].add(rule)
-  }
-
-  return returnValue
-}
-
-export default function expandTailwindAtRules(context) {
-  return async (root) => {
-    let layerNodes = {
-      base: null,
-      components: null,
-      utilities: null,
-      variants: null,
-    }
-
-    root.walkAtRules((rule) => {
-      // Make sure this file contains Tailwind directives. If not, we can save
-      // a lot of work and bail early. Also we don't have to register our touch
-      // file as a dependency since the output of this CSS does not depend on
-      // the source of any templates. Think Vue <style> blocks for example.
-      if (rule.name === 'tailwind') {
-        if (Object.keys(layerNodes).includes(rule.params)) {
-          layerNodes[rule.params] = rule
-        }
-      }
-    })
-
-    if (Object.values(layerNodes).every((n) => n === null)) {
-      return root
-    }
-
-    // ---
-
-    // Find potential rules in changed files
-    let candidates = new Set([...(context.candidates ?? []), sharedState.NOT_ON_DEMAND])
-    let seen = new Set()
-
-    env.DEBUG && console.time('Reading changed files')
-
-    if (__OXIDE__) {
-      // TODO: Pass through or implement `extractor`
-      for (let candidate of require('@tailwindcss/oxide').parseCandidateStringsFromFiles(
-        context.changedContent
-        // Object.assign({}, builtInTransformers, context.tailwindConfig.content.transform)
-      )) {
-        candidates.add(candidate)
-      }
-
-      // for (let { file, content, extension } of context.changedContent) {
-      //   let transformer = getTransformer(context.tailwindConfig, extension)
-      //   let extractor = getExtractor(context, extension)
-      //   getClassCandidatesOxide(file, transformer(content), extractor, candidates, seen)
-      // }
-    } else {
-      /** @type {[item: {file?: string, content?: string}, meta: {transformer: any, extractor: any}][]} */
-      let regexParserContent = []
-
-      for (let item of context.changedContent) {
-        let transformer = getTransformer(context.tailwindConfig, item.extension)
-        let extractor = getExtractor(context, item.extension)
-        regexParserContent.push([item, { transformer, extractor }])
-      }
-
-      const BATCH_SIZE = 500
-
-      for (let i = 0; i < regexParserContent.length; i += BATCH_SIZE) {
-        let batch = regexParserContent.slice(i, i + BATCH_SIZE)
-        await Promise.all(
-          batch.map(async ([{ file, content }, { transformer, extractor }]) => {
-            content = file ? await fs.promises.readFile(file, 'utf8') : content
-            getClassCandidates(transformer(content), extractor, candidates, seen)
-          })
-        )
-      }
-    }
-
-    env.DEBUG && console.timeEnd('Reading changed files')
-
-    // ---
-
-    // Generate the actual CSS
-    let classCacheCount = context.classCache.size
-
-    env.DEBUG && console.time('Generate rules')
-    env.DEBUG && console.time('Sorting candidates')
-    let sortedCandidates = __OXIDE__
-      ? candidates
-      : new Set(
-          [...candidates].sort((a, z) => {
-            if (a === z) return 0
-            if (a < z) return -1
-            return 1
-          })
-        )
-    env.DEBUG && console.timeEnd('Sorting candidates')
-    generateRules(sortedCandidates, context)
-    env.DEBUG && console.timeEnd('Generate rules')
-
-    // We only ever add to the classCache, so if it didn't grow, there is nothing new.
-    env.DEBUG && console.time('Build stylesheet')
-    if (context.stylesheetCache === null || context.classCache.size !== classCacheCount) {
-      context.stylesheetCache = buildStylesheet([...context.ruleCache], context)
-    }
-    env.DEBUG && console.timeEnd('Build stylesheet')
-
-    let {
-      defaults: defaultNodes,
-      base: baseNodes,
-      components: componentNodes,
-      utilities: utilityNodes,
-      variants: screenNodes,
-    } = context.stylesheetCache
-
-    // ---
-
-    // Replace any Tailwind directives with generated CSS
-
-    if (layerNodes.base) {
-      layerNodes.base.before(
-        cloneNodes([...baseNodes, ...defaultNodes], layerNodes.base.source, {
-          layer: 'base',
-        })
-      )
-      layerNodes.base.remove()
-    }
-
-    if (layerNodes.components) {
-      layerNodes.components.before(
-        cloneNodes([...componentNodes], layerNodes.components.source, {
-          layer: 'components',
-        })
-      )
-      layerNodes.components.remove()
-    }
-
-    if (layerNodes.utilities) {
-      layerNodes.utilities.before(
-        cloneNodes([...utilityNodes], layerNodes.utilities.source, {
-          layer: 'utilities',
-        })
-      )
-      layerNodes.utilities.remove()
-    }
-
-    // We do post-filtering to not alter the emitted order of the variants
-    const variantNodes = Array.from(screenNodes).filter((node) => {
-      const parentLayer = node.raws.tailwind?.parentLayer
-
-      if (parentLayer === 'components') {
-        return layerNodes.components !== null
-      }
-
-      if (parentLayer === 'utilities') {
-        return layerNodes.utilities !== null
-      }
-
-      return true
-    })
-
-    if (layerNodes.variants) {
-      layerNodes.variants.before(
-        cloneNodes(variantNodes, layerNodes.variants.source, {
-          layer: 'variants',
-        })
-      )
-      layerNodes.variants.remove()
-    } else if (variantNodes.length > 0) {
-      root.append(
-        cloneNodes(variantNodes, root.source, {
-          layer: 'variants',
-        })
-      )
-    }
-
-    // TODO: Why is the root node having no source location for `end` possible?
-    root.source.end = root.source.end ?? root.source.start
-
-    // If we've got a utility layer and no utilities are generated there's likely something wrong
-    const hasUtilityVariants = variantNodes.some(
-      (node) => node.raws.tailwind?.parentLayer === 'utilities'
-    )
-
-    if (layerNodes.utilities && utilityNodes.size === 0 && !hasUtilityVariants) {
-      log.warn('content-problems', [
-        'No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.',
-        'https://tailwindcss.com/docs/content-configuration',
-      ])
-    }
-
-    // ---
-
-    if (env.DEBUG) {
-      console.log('Potential classes: ', candidates.size)
-      console.log('Active contexts: ', sharedState.contextSourcesMap.size)
-    }
-
-    // Clear the cache for the changed files
-    context.changedContent = []
-
-    // Cleanup any leftover @layer atrules
-    root.walkAtRules('layer', (rule) => {
-      if (Object.keys(layerNodes).includes(rule.params)) {
-        rule.remove()
-      }
-    })
-  }
-}

package/src/lib/findAtConfigPath.js

@@ -1,48 +0,0 @@
-import fs from 'fs'
-import path from 'path'
-
-/**
- * Find the @config at-rule in the given CSS AST and return the relative path to the config file
- *
- * @param {import('postcss').Root} root
- * @param {import('postcss').Result} result
- */
-export function findAtConfigPath(root, result) {
-  let configPath = null
-  let relativeTo = null
-
-  root.walkAtRules('config', (rule) => {
-    relativeTo = rule.source?.input.file ?? result.opts.from ?? null
-
-    if (relativeTo === null) {
-      throw rule.error(
-        'The `@config` directive cannot be used without setting `from` in your PostCSS config.'
-      )
-    }
-
-    if (configPath) {
-      throw rule.error('Only one `@config` directive is allowed per file.')
-    }
-
-    let matches = rule.params.match(/(['"])(.*?)\1/)
-    if (!matches) {
-      throw rule.error('A path is required when using the `@config` directive.')
-    }
-
-    let inputPath = matches[2]
-    if (path.isAbsolute(inputPath)) {
-      throw rule.error('The `@config` directive cannot be used with an absolute path.')
-    }
-
-    configPath = path.resolve(path.dirname(relativeTo), inputPath)
-    if (!fs.existsSync(configPath)) {
-      throw rule.error(
-        `The config file at "${inputPath}" does not exist. Make sure the path is correct and the file exists.`
-      )
-    }
-
-    rule.remove()
-  })
-
-  return configPath ? configPath : null
-}