Created
August 4, 2021 11:48
-
-
Save navin-moorthy/9bbfbb10129b0930375d34ae9d4e862c to your computer and use it in GitHub Desktop.
Tailwind JIT - Prepend stackable variant before DEFAULT utilities
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/node_modules/tailwindcss/lib/jit/lib/generateRules.js b/node_modules/tailwindcss/lib/jit/lib/generateRules.js | |
index 9b59423..c2f8660 100644 | |
--- a/node_modules/tailwindcss/lib/jit/lib/generateRules.js | |
+++ b/node_modules/tailwindcss/lib/jit/lib/generateRules.js | |
-function applyVariant(variant, matches, context) { | |
+function applyVariant(variant, matches, hasLibVariant, context) { | |
if (matches.length === 0) { | |
return matches; | |
} | |
if (context.variantMap.has(variant)) { | |
+ let updateSort = | |
+ hasLibVariant && | |
+ !['sm', 'md', 'lg', 'xl', '2xl', 'motion-safe', 'dark', 'motion-reduce'].includes(variant); | |
let variantFunctionTuples = context.variantMap.get(variant); | |
let result = []; | |
@@ -177,7 +180,7 @@ function applyVariant(variant, matches, context) { | |
} | |
let withOffset = [{ | |
- sort: variantSort | sort, | |
+ sort: updateSort ? 0n : variantSort | sort, | |
layer, | |
options | |
}, clone.nodes[0]]; | |
@@ -240,6 +243,7 @@ function splitWithSeparator(input, separator) { | |
function* resolveMatches(candidate, context) { | |
let separator = context.tailwindConfig.separator; | |
let [classCandidate, ...variants] = splitWithSeparator(candidate, separator).reverse(); | |
+ let hasLibVariant = variants.includes('lib'); | |
let important = false; | |
if (classCandidate.startsWith('!')) { | |
@@ -271,7 +275,8 @@ function* resolveMatches(candidate, context) { | |
matches.push([{ ...sort, | |
options: { ...sort.options, | |
...options | |
- } | |
+ }, | |
+ sort: hasLibVariant ? 0n : sort.sort, | |
}, rule]); | |
} | |
} | |
@@ -284,7 +289,8 @@ function* resolveMatches(candidate, context) { | |
matches.push([{ ...sort, | |
options: { ...sort.options, | |
...options | |
- } | |
+ }, | |
+ sort: hasLibVariant ? 0n : sort.sort, | |
}, rule]); | |
} | |
} | |
@@ -297,7 +303,7 @@ function* resolveMatches(candidate, context) { | |
} | |
for (let variant of variants) { | |
- matches = applyVariant(variant, matches, context); | |
+ matches = applyVariant(variant, matches, hasLibVariant, context); | |
} | |
for (let match of matches) { | |
diff --git a/node_modules/tailwindcss/lib/jit/lib/setupContextUtils.js b/node_modules/tailwindcss/lib/jit/lib/setupContextUtils.js | |
index a7d739d..782f46d 100644 | |
--- a/node_modules/tailwindcss/lib/jit/lib/setupContextUtils.js | |
+++ b/node_modules/tailwindcss/lib/jit/lib/setupContextUtils.js | |
@@ -467,10 +467,11 @@ function resolvePlugins(context, tailwindDirectives, root) { | |
function registerPlugins(plugins, context) { | |
let variantList = []; | |
let variantMap = new Map(); | |
+ let reservedBits = 20n; | |
let offsets = { | |
- base: 0n, | |
- components: 0n, | |
- utilities: 0n | |
+ base: (1n << reservedBits) << 0n, | |
+ components: (1n << reservedBits) << 1n, | |
+ utilities: (1n << reservedBits) << 2n | |
}; | |
let pluginApi = buildPluginApi(context.tailwindConfig, context, { | |
variantList, | |
@@ -490,7 +491,7 @@ function registerPlugins(plugins, context) { | |
let highestOffset = (args => args.reduce((m, e) => e > m ? e : m))([offsets.base, offsets.components, offsets.utilities]); | |
- let reservedBits = BigInt(highestOffset.toString(2).length); | |
+ reservedBits = BigInt(highestOffset.toString(2).length); | |
context.layerOrder = { | |
base: 1n << reservedBits << 0n, | |
components: 1n << reservedBits << 1n, | |
@@ -499,6 +500,7 @@ function registerPlugins(plugins, context) { | |
reservedBits += 3n; | |
let offset = 0; | |
context.variantOrder = new Map(variantList.map((variant, i) => { | |
+ if (variant.includes('lib')) return [variant, 1n]; | |
let variantFunctions = variantMap.get(variant).length; | |
let bits = 1n << BigInt(i + offset) << reservedBits; | |
offset += variantFunctions - 1; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Above patch is a temporary workaround to fix this issue in JIT.
Not a 100% working fix, but works in well in most of our cases.
lib
with your variant in the lines33
&98
.patch
file to you package root at./patches/tailwindcss+2.2.7.patch
"postinstall": "patch-package"
in your scriptnpm install
/yarn install
to apply the patch