From b3b2debdd9b8570e3256edf79292537763abe3b5 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Wed, 6 Mar 2024 10:56:56 -0500 Subject: [PATCH] [v4] Support old important modifier position (#13103) * Support old important modifier position * update --------- Co-authored-by: Adam Wathan <4323180+adamwathan@users.noreply.github.com> Co-authored-by: Jordan Pittman --- packages/tailwindcss/src/candidate.ts | 6 ++++++ packages/tailwindcss/src/index.test.ts | 8 ++++++++ 2 files changed, 14 insertions(+) diff --git a/packages/tailwindcss/src/candidate.ts b/packages/tailwindcss/src/candidate.ts index e1ce018ec..e3f6b92f2 100644 --- a/packages/tailwindcss/src/candidate.ts +++ b/packages/tailwindcss/src/candidate.ts @@ -269,6 +269,12 @@ export function parseCandidate( base = base.slice(0, -1) } + // Legacy syntax with leading `!`, e.g. `!mx-4`. + else if (base[0] === '!') { + state.important = true + base = base.slice(1) + } + // Arbitrary properties if (base[0] === '[') { let [baseWithoutModifier, modifierSegment = null] = segment(base, '/') diff --git a/packages/tailwindcss/src/index.test.ts b/packages/tailwindcss/src/index.test.ts index aaaa6a058..7457ac352 100644 --- a/packages/tailwindcss/src/index.test.ts +++ b/packages/tailwindcss/src/index.test.ts @@ -341,6 +341,14 @@ describe('important', () => { `) }) + it('should generate an important utility with legacy syntax', () => { + expect(run(['!underline'])).toMatchInlineSnapshot(` + ".\\!underline { + text-decoration-line: underline !important; + }" + `) + }) + it('should not mark declarations inside of @keyframes as important', () => { expect( compileCss(