tailwindcss/src/lib/generateUtilities.js at develop · WorldofOpenDev/tailwindcss · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
import _ from 'lodash'
import postcss from 'postcss'
import applyClassPrefix from '../util/applyClassPrefix'
import backgroundColors from '../generators/backgroundColors'
import backgroundPositions from '../generators/backgroundPositions'
import backgroundSize from '../generators/backgroundSize'
import borderColors from '../generators/borderColors'
import borderStyles from '../generators/borderStyles'
import borderWidths from '../generators/borderWidths'
import container from '../generators/container'
import cursor from '../generators/cursor'
import display from '../generators/display'
import flex from '../generators/flex'
import floats from '../generators/floats'
import forms from '../generators/forms'
import lists from '../generators/lists'
import opacity from '../generators/opacity'
import overflow from '../generators/overflow'
import pointerEvents from '../generators/pointerEvents'
import position from '../generators/position'
import resize from '../generators/resize'
import responsive from '../util/responsive'
import rounded from '../generators/rounded'
import shadows from '../generators/shadows'
import sizing from '../generators/sizing'
import spacing from '../generators/spacing'
import textAlign from '../generators/textAlign'
import textColors from '../generators/textColors'
import textFonts from '../generators/textFonts'
import textLeading from '../generators/textLeading'
import textSizes from '../generators/textSizes'
import textStyle from '../generators/textStyle'
import textTracking from '../generators/textTracking'
import textWeights from '../generators/textWeights'
import textWrap from '../generators/textWrap'
import userSelect from '../generators/userSelect'
import verticalAlign from '../generators/verticalAlign'
import visibility from '../generators/visibility'
import zIndex from '../generators/zIndex'

export default function(config) {
  return function(css) {
    const unwrappedConfig = config()

    css.walkAtRules('tailwind', atRule => {
      if (atRule.params === 'utilities') {
        const utilities = postcss.root({
          nodes: _.flatten([
            lists(unwrappedConfig),
            forms(unwrappedConfig),
            textSizes(unwrappedConfig),
            textWeights(unwrappedConfig),
            textFonts(unwrappedConfig),
            textColors(unwrappedConfig),
            textLeading(unwrappedConfig),
            textTracking(unwrappedConfig),
            textAlign(unwrappedConfig),
            textWrap(unwrappedConfig),
            textStyle(unwrappedConfig),
            verticalAlign(unwrappedConfig),
            backgroundColors(unwrappedConfig),
            backgroundPositions(unwrappedConfig),
            backgroundSize(unwrappedConfig),
            borderWidths(unwrappedConfig),
            borderColors(unwrappedConfig),
            borderStyles(unwrappedConfig),
            rounded(unwrappedConfig),
            display(unwrappedConfig),
            position(unwrappedConfig),
            overflow(unwrappedConfig),
            sizing(unwrappedConfig),
            spacing(unwrappedConfig),
            shadows(unwrappedConfig),
            flex(unwrappedConfig),
            floats(unwrappedConfig),
            visibility(unwrappedConfig),
            zIndex(unwrappedConfig),
            opacity(unwrappedConfig),
            userSelect(unwrappedConfig),
            pointerEvents(unwrappedConfig),
            resize(unwrappedConfig),
            cursor(unwrappedConfig),
          ]),
        })

        if (_.get(unwrappedConfig, 'options.important', false)) {
          utilities.walkDecls(decl => (decl.important = true))
        }

        const tailwindClasses = postcss.root({
          nodes: [...container(unwrappedConfig), responsive(utilities)],
        })

        applyClassPrefix(tailwindClasses, _.get(unwrappedConfig, 'options.prefix', ''))

        atRule.before(tailwindClasses)
        atRule.remove()
      }
    })
  }
}