From a8065bfc176791a9b9c8d6082d971848e9123595 Mon Sep 17 00:00:00 2001
From: dengfuping <dengfuping_private@163.com>
Date: Mon, 11 Dec 2023 14:52:42 +0800
Subject: [PATCH] fix(transformer): value => value[0] for
 legacyLogicalProperties to avoid duplicate !important

---
 src/transformers/legacyLogicalProperties.ts | 2 +-
 tests/transform.spec.tsx                    | 5 ++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/transformers/legacyLogicalProperties.ts b/src/transformers/legacyLogicalProperties.ts
index a820f75..f06e94a 100644
--- a/src/transformers/legacyLogicalProperties.ts
+++ b/src/transformers/legacyLogicalProperties.ts
@@ -151,7 +151,7 @@ const transform: Transformer = {
           });
         } else if (matchValue.length === 1) {
           // Handle like `marginBlockStart` => `marginTop`
-          clone[matchValue[0]] = wrapImportantAndSkipCheck(value, important);
+          clone[matchValue[0]] = wrapImportantAndSkipCheck(values[0], important);
         } else if (matchValue.length === 2) {
           // Handle like `marginBlock` => `marginTop` & `marginBottom`
           matchValue.forEach((matchKey, index) => {
diff --git a/tests/transform.spec.tsx b/tests/transform.spec.tsx
index 0538552..e2f0abf 100644
--- a/tests/transform.spec.tsx
+++ b/tests/transform.spec.tsx
@@ -151,13 +151,16 @@ describe('transform', () => {
           css={{
             '.box': {
               paddingInline: '33px !important',
+              marginBlockStart: '33px !important',
+              marginBlockEnd: 'calc(2px + 3px) !important',
             },
           }}
         />,
       );
 
       const styleText = document.head.querySelector('style')?.innerHTML;
-      expect(styleText).toContain('33px!important');
+      expect(styleText).toContain('padding-left:33px!important;padding-right:33px!important');
+      expect(styleText).toContain('margin-top:33px!important;margin-bottom:calc(2px+3px)!important;');
     });
 
     it('split with calc() and var()', () => {