Copy JIT over, tests passing separately, not yet integrated

Author: adamwathan

jit/corePlugins/accessibility.js

@@ -0,0 +1,25 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.sr-only': {
+    position: 'absolute',
+    width: '1px',
+    height: '1px',
+    padding: '0',
+    margin: '-1px',
+    overflow: 'hidden',
+    clip: 'rect(0, 0, 0, 0)',
+    whiteSpace: 'nowrap',
+    borderWidth: '0',
+  },
+  '.not-sr-only': {
+    position: 'static',
+    width: 'auto',
+    height: 'auto',
+    padding: '0',
+    margin: '0',
+    overflow: 'visible',
+    clip: 'auto',
+    whiteSpace: 'normal',
+  },
+})

jit/corePlugins/alignContent.js

@@ -0,0 +1,22 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.content-center': {
+    'align-content': 'center',
+  },
+  '.content-start': {
+    'align-content': 'flex-start',
+  },
+  '.content-end': {
+    'align-content': 'flex-end',
+  },
+  '.content-between': {
+    'align-content': 'space-between',
+  },
+  '.content-around': {
+    'align-content': 'space-around',
+  },
+  '.content-evenly': {
+    'align-content': 'space-evenly',
+  },
+})

jit/corePlugins/alignItems.js

@@ -0,0 +1,19 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.items-start': {
+    'align-items': 'flex-start',
+  },
+  '.items-end': {
+    'align-items': 'flex-end',
+  },
+  '.items-center': {
+    'align-items': 'center',
+  },
+  '.items-baseline': {
+    'align-items': 'baseline',
+  },
+  '.items-stretch': {
+    'align-items': 'stretch',
+  },
+})

jit/corePlugins/alignSelf.js

@@ -0,0 +1,19 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.self-auto': {
+    'align-self': 'auto',
+  },
+  '.self-start': {
+    'align-self': 'flex-start',
+  },
+  '.self-end': {
+    'align-self': 'flex-end',
+  },
+  '.self-center': {
+    'align-self': 'center',
+  },
+  '.self-stretch': {
+    'align-self': 'stretch',
+  },
+})

jit/corePlugins/animation.js

@@ -0,0 +1,39 @@
+const { nameClass } = require('../pluginUtils')
+const transformThemeValue = require('tailwindcss/lib/util/transformThemeValue').default
+const parseAnimationValue = require('tailwindcss/lib/util/parseAnimationValue').default
+
+module.exports = function ({ matchUtilities, jit: { theme } }) {
+  let keyframes = Object.fromEntries(
+    Object.entries(theme.keyframes).map(([key, value]) => {
+      return [
+        key,
+        [
+          {
+            [`@keyframes ${key}`]: value,
+          },
+          { respectVariants: false },
+        ],
+      ]
+    })
+  )
+
+  let transformValue = transformThemeValue('animation')
+  matchUtilities({
+    animate: [
+      (modifier, { theme }) => {
+        let value = transformValue(theme.animation[modifier])
+
+        if (modifier === '' || value === undefined) {
+          return []
+        }
+
+        let { name: animationName } = parseAnimationValue(value)
+
+        return [
+          keyframes[animationName],
+          { [nameClass('animate', modifier)]: { animation: value } },
+        ].filter(Boolean)
+      },
+    ],
+  })
+}

jit/corePlugins/appearance.js

@@ -0,0 +1,5 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.appearance-none': { appearance: 'none' },
+})

jit/corePlugins/backgroundAttachment.js

@@ -0,0 +1,7 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.bg-fixed': { 'background-attachment': 'fixed' },
+  '.bg-local': { 'background-attachment': 'local' },
+  '.bg-scroll': { 'background-attachment': 'scroll' },
+})

jit/corePlugins/backgroundClip.js

@@ -0,0 +1,8 @@
+const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
+
+module.exports = createSimpleStaticUtilityPlugin({
+  '.bg-clip-border': { 'background-clip': 'border-box' },
+  '.bg-clip-padding': { 'background-clip': 'padding-box' },
+  '.bg-clip-content': { 'background-clip': 'content-box' },
+  '.bg-clip-text': { 'background-clip': 'text' },
+})

jit/corePlugins/backgroundColor.js

@@ -0,0 +1,27 @@
+const transformThemeValue = require('tailwindcss/lib/util/transformThemeValue').default
+const flattenColorPalette = require('tailwindcss/lib/util/flattenColorPalette').default
+const withAlphaVariable = require('tailwindcss/lib/util/withAlphaVariable').default
+const toColorValue = require('tailwindcss/lib/util/toColorValue').default
+const { asColor, nameClass } = require('../pluginUtils')
+
+module.exports = function ({ matchUtilities, jit: { theme } }) {
+  let colorPalette = flattenColorPalette(theme.backgroundColor)
+
+  matchUtilities({
+    bg: (modifier, { theme }) => {
+      let value = asColor(modifier, colorPalette)
+
+      if (value === undefined) {
+        return []
+      }
+
+      return {
+        [nameClass('bg', modifier)]: withAlphaVariable({
+          color: value,
+          property: 'background-color',
+          variable: '--tw-bg-opacity',
+        }),
+      }
+    },
+  })
+}

jit/corePlugins/backgroundImage.js

@@ -0,0 +1,15 @@
+const { nameClass } = require('../pluginUtils')
+
+module.exports = function ({ matchUtilities, jit: { theme } }) {
+  matchUtilities({
+    bg: (modifier, { theme }) => {
+      let value = theme.backgroundImage[modifier]
+
+      if (value === undefined) {
+        return []
+      }
+
+      return { [nameClass('bg', modifier)]: { 'background-image': value } }
+    },
+  })
+}