remove deprecated opacity utilities

dcastil · Jan 24, 2025 · 465b1a7 · 465b1a7
1 parent bfc7a42
commit 465b1a7
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 45 deletions.
diff --git a/src/lib/default-config.ts b/src/lib/default-config.ts
@@ -811,11 +811,6 @@ export const getDefaultConfig = () => {
              * @see https://tailwindcss.com/docs/placeholder-color
              */
             'placeholder-color': [{ placeholder: [colors] }],
-            /**
-             * Placeholder Opacity
-             * @see https://tailwindcss.com/docs/placeholder-opacity
-             */
-            'placeholder-opacity': [{ 'placeholder-opacity': [opacity] }],
             /**
              * Text Alignment
              * @see https://tailwindcss.com/docs/text-align
@@ -826,11 +821,6 @@ export const getDefaultConfig = () => {
              * @see https://tailwindcss.com/docs/text-color
              */
             'text-color': [{ text: [colors] }],
-            /**
-             * Text Opacity
-             * @see https://tailwindcss.com/docs/text-opacity
-             */
-            'text-opacity': [{ 'text-opacity': [opacity] }],
             /**
              * Text Decoration
              * @see https://tailwindcss.com/docs/text-decoration
@@ -930,12 +920,6 @@ export const getDefaultConfig = () => {
              * @see https://tailwindcss.com/docs/background-clip
              */
             'bg-clip': [{ 'bg-clip': ['border', 'padding', 'content', 'text'] }],
-            /**
-             * Background Opacity
-             * @deprecated since Tailwind CSS v3.0.0
-             * @see https://tailwindcss.com/docs/background-opacity
-             */
-            'bg-opacity': [{ 'bg-opacity': [opacity] }],
             /**
              * Background Origin
              * @see https://tailwindcss.com/docs/background-origin
@@ -1133,11 +1117,6 @@ export const getDefaultConfig = () => {
              * @see https://tailwindcss.com/docs/border-width
              */
             'border-w-l': [{ 'border-l': [borderWidth] }],
-            /**
-             * Border Opacity
-             * @see https://tailwindcss.com/docs/border-opacity
-             */
-            'border-opacity': [{ 'border-opacity': [opacity] }],
             /**
              * Border Style
              * @see https://tailwindcss.com/docs/border-style
@@ -1163,11 +1142,6 @@ export const getDefaultConfig = () => {
              * @see https://tailwindcss.com/docs/divide-width
              */
             'divide-y-reverse': ['divide-y-reverse'],
-            /**
-             * Divide Opacity
-             * @see https://tailwindcss.com/docs/divide-opacity
-             */
-            'divide-opacity': [{ 'divide-opacity': [opacity] }],
             /**
              * Divide Style
              * @see https://tailwindcss.com/docs/divide-style

diff --git a/src/lib/types.ts b/src/lib/types.ts
@@ -223,7 +223,6 @@ export type DefaultClassGroupIds =
     | 'bg-clip'
     | 'bg-color'
     | 'bg-image'
-    | 'bg-opacity'
     | 'bg-origin'
     | 'bg-position'
     | 'bg-repeat'
@@ -239,7 +238,6 @@ export type DefaultClassGroupIds =
     | 'border-color-x'
     | 'border-color-y'
     | 'border-color'
-    | 'border-opacity'
     | 'border-spacing-x'
     | 'border-spacing-y'
     | 'border-spacing'
@@ -276,7 +274,6 @@ export type DefaultClassGroupIds =
     | 'delay'
     | 'display'
     | 'divide-color'
-    | 'divide-opacity'
     | 'divide-style'
     | 'divide-x-reverse'
     | 'divide-x'
@@ -380,7 +377,6 @@ export type DefaultClassGroupIds =
     | 'place-items'
     | 'place-self'
     | 'placeholder-color'
-    | 'placeholder-opacity'
     | 'pointer-events'
     | 'position'
     | 'pr'
@@ -467,7 +463,6 @@ export type DefaultClassGroupIds =
     | 'text-decoration-style'
     | 'text-decoration-thickness'
     | 'text-decoration'
-    | 'text-opacity'
     | 'text-overflow'
     | 'text-transform'
     | 'text-wrap'

diff --git a/tests/arbitrary-properties.test.ts b/tests/arbitrary-properties.test.ts
@@ -22,8 +22,8 @@ test('handles arbitrary property conflicts with modifiers correctly', () => {
     expect(
         twMerge('[paint-order:markers] [paint-order:normal] [--my-var:2rem] lg:[--my-var:4px]'),
     ).toBe('[paint-order:normal] [--my-var:2rem] lg:[--my-var:4px]')
-    expect(twMerge('bg-[#B91C1C] bg-opacity-[0.56] bg-opacity-[48%]')).toBe(
-        'bg-[#B91C1C] bg-opacity-[48%]',
+    expect(twMerge('bg-[#B91C1C] bg-radial-[at_50%_75%] bg-radial-[at_25%_25%]')).toBe(
+        'bg-[#B91C1C] bg-radial-[at_25%_25%]',
     )
 })
 

diff --git a/tests/class-map.test.ts b/tests/class-map.test.ts
@@ -43,7 +43,6 @@ test('class map has correct class groups at first part', () => {
             'bg-clip',
             'bg-color',
             'bg-image',
-            'bg-opacity',
             'bg-origin',
             'bg-position',
             'bg-repeat',
@@ -62,7 +61,6 @@ test('class map has correct class groups at first part', () => {
             'border-color-t',
             'border-color-x',
             'border-color-y',
-            'border-opacity',
             'border-spacing',
             'border-spacing-x',
             'border-spacing-y',
@@ -98,7 +96,6 @@ test('class map has correct class groups at first part', () => {
         diagonal: ['fvn-fraction'],
         divide: [
             'divide-color',
-            'divide-opacity',
             'divide-style',
             'divide-x',
             'divide-x-reverse',
@@ -182,7 +179,7 @@ test('class map has correct class groups at first part', () => {
         perspective: ['perspective', 'perspective-origin'],
         pl: ['pl'],
         place: ['place-content', 'place-items', 'place-self'],
-        placeholder: ['placeholder-color', 'placeholder-opacity'],
+        placeholder: ['placeholder-color'],
         pointer: ['pointer-events'],
         pr: ['pr'],
         proportional: ['fvn-spacing'],
@@ -256,14 +253,7 @@ test('class map has correct class groups at first part', () => {
         subpixel: ['font-smoothing'],
         table: ['display', 'table-layout'],
         tabular: ['fvn-spacing'],
-        text: [
-            'font-size',
-            'text-alignment',
-            'text-color',
-            'text-opacity',
-            'text-overflow',
-            'text-wrap',
-        ],
+        text: ['font-size', 'text-alignment', 'text-color', 'text-overflow', 'text-wrap'],
         to: ['gradient-to', 'gradient-to-pos'],
         top: ['top'],
         touch: ['touch', 'touch-pz', 'touch-x', 'touch-y'],