add support for Tailwind v4.2 block-start/end logical properties

Adds pbs, pbe, mbs, mbe, scroll-mbs, scroll-mbe, scroll-pbs, scroll-pbe
utilities matching the new padding/margin/scroll block-start and block-end
classes introduced in Tailwind CSS v4.2.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: nicolas-cusan

packages/tailwind-clamp-merge/lib/__tests__/index.test.js

@@ -175,6 +175,30 @@ describe('hyphenated prop distinction', () => {
     ).toBe('clamp-[scroll-p,1rem,2rem] clamp-[scroll-ps,0.5rem,1rem]');
   });
 
+  it('pbs and pbe do not interfere', () => {
+    expect(
+      twMerge('clamp-[pbs,1rem,2rem] clamp-[pbe,0.5rem,1rem]')
+    ).toBe('clamp-[pbs,1rem,2rem] clamp-[pbe,0.5rem,1rem]');
+  });
+
+  it('mbs and mbe do not interfere', () => {
+    expect(
+      twMerge('clamp-[mbs,1rem,2rem] clamp-[mbe,0.5rem,1rem]')
+    ).toBe('clamp-[mbs,1rem,2rem] clamp-[mbe,0.5rem,1rem]');
+  });
+
+  it('scroll-mbs and scroll-mbe do not interfere', () => {
+    expect(
+      twMerge('clamp-[scroll-mbs,1rem,2rem] clamp-[scroll-mbe,0.5rem,1rem]')
+    ).toBe('clamp-[scroll-mbs,1rem,2rem] clamp-[scroll-mbe,0.5rem,1rem]');
+  });
+
+  it('scroll-pbs and scroll-pbe do not interfere', () => {
+    expect(
+      twMerge('clamp-[scroll-pbs,1rem,2rem] clamp-[scroll-pbe,0.5rem,1rem]')
+    ).toBe('clamp-[scroll-pbs,1rem,2rem] clamp-[scroll-pbe,0.5rem,1rem]');
+  });
+
   it('gap-x and gap-y do not interfere', () => {
     expect(
       twMerge('clamp-[gap-x,1rem,2rem] clamp-[gap-y,0.5rem,1rem]')

packages/tailwind-clamp-merge/lib/mapping.js

@@ -18,6 +18,8 @@ export const PROP_TO_GROUP = {
   pe: 'pe',
   px: 'px',
   py: 'py',
+  pbs: 'pbs',
+  pbe: 'pbe',
 
   // Margin
   m: 'm',
@@ -29,6 +31,8 @@ export const PROP_TO_GROUP = {
   me: 'me',
   mx: 'mx',
   my: 'my',
+  mbs: 'mbs',
+  mbe: 'mbe',
 
   // Inset
   inset: 'inset',
@@ -67,6 +71,8 @@ export const PROP_TO_GROUP = {
   'scroll-mb': 'scroll-mb',
   'scroll-ml': 'scroll-ml',
   'scroll-mr': 'scroll-mr',
+  'scroll-mbs': 'scroll-mbs',
+  'scroll-mbe': 'scroll-mbe',
 
   // Scroll Padding
   'scroll-p': 'scroll-p',
@@ -78,6 +84,8 @@ export const PROP_TO_GROUP = {
   'scroll-pb': 'scroll-pb',
   'scroll-pl': 'scroll-pl',
   'scroll-pr': 'scroll-pr',
+  'scroll-pbs': 'scroll-pbs',
+  'scroll-pbe': 'scroll-pbe',
 
   // Translate
   translate: 'translate',

packages/tailwind-clamp/lib/__tests__/index.test.js

@@ -605,6 +605,70 @@ describe('resolveProperty', () => {
         props: ['inset'],
       });
     });
+
+    it('resolves "pbs" to paddingBlockStart', () => {
+      expect(resolveProperty('pbs')).toEqual({
+        type: 'spacing',
+        key: 'padding',
+        props: ['paddingBlockStart'],
+      });
+    });
+
+    it('resolves "pbe" to paddingBlockEnd', () => {
+      expect(resolveProperty('pbe')).toEqual({
+        type: 'spacing',
+        key: 'padding',
+        props: ['paddingBlockEnd'],
+      });
+    });
+
+    it('resolves "mbs" to marginBlockStart', () => {
+      expect(resolveProperty('mbs')).toEqual({
+        type: 'spacing',
+        key: 'margin',
+        props: ['marginBlockStart'],
+      });
+    });
+
+    it('resolves "mbe" to marginBlockEnd', () => {
+      expect(resolveProperty('mbe')).toEqual({
+        type: 'spacing',
+        key: 'margin',
+        props: ['marginBlockEnd'],
+      });
+    });
+
+    it('resolves "scroll-mbs" to scrollMarginBlockStart', () => {
+      expect(resolveProperty('scroll-mbs')).toEqual({
+        type: 'spacing',
+        key: 'scrollMargin',
+        props: ['scrollMarginBlockStart'],
+      });
+    });
+
+    it('resolves "scroll-mbe" to scrollMarginBlockEnd', () => {
+      expect(resolveProperty('scroll-mbe')).toEqual({
+        type: 'spacing',
+        key: 'scrollMargin',
+        props: ['scrollMarginBlockEnd'],
+      });
+    });
+
+    it('resolves "scroll-pbs" to scrollPaddingBlockStart', () => {
+      expect(resolveProperty('scroll-pbs')).toEqual({
+        type: 'spacing',
+        key: 'scrollPadding',
+        props: ['scrollPaddingBlockStart'],
+      });
+    });
+
+    it('resolves "scroll-pbe" to scrollPaddingBlockEnd', () => {
+      expect(resolveProperty('scroll-pbe')).toEqual({
+        type: 'spacing',
+        key: 'scrollPadding',
+        props: ['scrollPaddingBlockEnd'],
+      });
+    });
   });
 
   describe('multi-prop outputs', () => {

packages/tailwind-clamp/lib/resolve-property.js

@@ -73,6 +73,20 @@ export const resolveProperty = (name) => {
         props: ['paddingBlock'],
       };
 
+    case 'pbs':
+      return {
+        type: 'spacing',
+        key: 'padding',
+        props: ['paddingBlockStart'],
+      };
+
+    case 'pbe':
+      return {
+        type: 'spacing',
+        key: 'padding',
+        props: ['paddingBlockEnd'],
+      };
+
     case 'm':
       return {
         type: 'spacing',
@@ -136,6 +150,20 @@ export const resolveProperty = (name) => {
         props: ['marginBlock'],
       };
 
+    case 'mbs':
+      return {
+        type: 'spacing',
+        key: 'margin',
+        props: ['marginBlockStart'],
+      };
+
+    case 'mbe':
+      return {
+        type: 'spacing',
+        key: 'margin',
+        props: ['marginBlockEnd'],
+      };
+
     case 'inset':
       return {
         type: 'spacing',
@@ -331,6 +359,20 @@ export const resolveProperty = (name) => {
         props: ['scrollMarginRight'],
       };
 
+    case 'scroll-mbs':
+      return {
+        type: 'spacing',
+        key: 'scrollMargin',
+        props: ['scrollMarginBlockStart'],
+      };
+
+    case 'scroll-mbe':
+      return {
+        type: 'spacing',
+        key: 'scrollMargin',
+        props: ['scrollMarginBlockEnd'],
+      };
+
     case 'scroll-p':
       return {
         type: 'spacing',
@@ -394,6 +436,20 @@ export const resolveProperty = (name) => {
         props: ['scrollPaddingRight'],
       };
 
+    case 'scroll-pbs':
+      return {
+        type: 'spacing',
+        key: 'scrollPadding',
+        props: ['scrollPaddingBlockStart'],
+      };
+
+    case 'scroll-pbe':
+      return {
+        type: 'spacing',
+        key: 'scrollPadding',
+        props: ['scrollPaddingBlockEnd'],
+      };
+
     case 'translate':
       return {
         type: 'spacing',