From 9ae0623a7a78e06182ae0ea05f54a841d5417a56 Mon Sep 17 00:00:00 2001
From: Bowen Tan <bowen.tan@smartx.com>
Date: Thu, 16 Dec 2021 17:14:06 +0800
Subject: [PATCH] change style trait params to array

---
 packages/editor/__fixture__/application.ts | 21 ++++++++++++---------
 packages/runtime/src/traits/core/style.tsx | 21 ++++++++++++---------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/packages/editor/__fixture__/application.ts b/packages/editor/__fixture__/application.ts
index f68528e8..3d91fbb3 100644
--- a/packages/editor/__fixture__/application.ts
+++ b/packages/editor/__fixture__/application.ts
@@ -82,9 +82,13 @@ export const ApplicationFixture: Record<string, Application> = {
             {
               type: 'core/v1/style',
               properties: {
-                styleSlot: 'content',
-                style: "{{!usersTable.selectedItem ? 'display: none' : ''}}",
-              },
+                styles: [
+                  {
+                    styleSlot: 'content',
+                    style: "{{!usersTable.selectedItem ? 'display: none' : ''}}",
+                  },
+                ]
+              }
             },
           ],
         },
@@ -110,7 +114,7 @@ export const ApplicationFixture: Record<string, Application> = {
             },
             {
               type: 'core/v1/style',
-              properties: { styleSlot: 'content', style: 'padding: 0; border: none' },
+              properties: { styles: [{styleSlot: 'content', style: 'padding: 0; border: none' }]},
             },
           ],
         },
@@ -174,7 +178,7 @@ export const ApplicationFixture: Record<string, Application> = {
             },
             {
               type: 'core/v1/style',
-              properties: { styleSlot: 'content', style: 'padding: 0; border: none' },
+              properties: { styles: [{styleSlot: 'content', style: 'padding: 0; border: none' }]},
             },
           ],
         },
@@ -241,7 +245,6 @@ export const ApplicationFixture: Record<string, Application> = {
               type: 'core/v1/slot',
               properties: { container: { id: 'hstack4', slot: 'content' } },
             },
-            { type: 'core/v1/style', properties: { string: { kind: {}, type: {} } } },
           ],
         },
         {
@@ -255,7 +258,7 @@ export const ApplicationFixture: Record<string, Application> = {
             },
             {
               type: 'core/v1/style',
-              properties: { styleSlot: 'content', style: 'padding: 0; border: none' },
+              properties: { styles: [{styleSlot: 'content', style: 'padding: 0; border: none' }]},
             },
           ],
         },
@@ -281,7 +284,7 @@ export const ApplicationFixture: Record<string, Application> = {
             },
             {
               type: 'core/v1/style',
-              properties: { styleSlot: 'content', style: 'padding: 0; border: none' },
+              properties: { styles: [{styleSlot: 'content', style: 'padding: 0; border: none' }]},
             },
           ],
         },
@@ -329,7 +332,7 @@ export const ApplicationFixture: Record<string, Application> = {
             },
             {
               type: 'core/v1/style',
-              properties: { styleSlot: 'content', style: 'padding: 0; border: none' },
+              properties: { styles: [{styleSlot: 'content', style: 'padding: 0; border: none' }]},
             },
           ],
         },
diff --git a/packages/runtime/src/traits/core/style.tsx b/packages/runtime/src/traits/core/style.tsx
index 159aa61c..82ff0356 100644
--- a/packages/runtime/src/traits/core/style.tsx
+++ b/packages/runtime/src/traits/core/style.tsx
@@ -2,22 +2,25 @@ import { createTrait } from '@sunmao-ui/core';
 import { Static, Type } from '@sinclair/typebox';
 import { TraitImplementation } from '../../types/RuntimeSchema';
 
-const StyleTrait: TraitImplementation<Static<typeof PropsSchema>> = ({
-  styleSlot,
-  style,
-}) => {
+const StyleTrait: TraitImplementation<Static<typeof PropsSchema>> = ({ styles }) => {
+  const customStyle: Record<string, string> = {};
+  styles.forEach(style => {
+    customStyle[style.styleSlot] = style.style;
+  });
   return {
     props: {
-      customStyle: {
-        [styleSlot]: style,
-      },
+      customStyle,
     },
   };
 };
 
 const PropsSchema = Type.Object({
-  styleSlot: Type.String(),
-  style: Type.String(),
+  styles: Type.Array(
+    Type.Object({
+      styleSlot: Type.String(),
+      style: Type.String(),
+    })
+  ),
 });
 
 export default {