Add styles.Merge for combining styles

styles/utils.go

@@ -0,0 +1,12 @@
+package styles
+
+// Merge combines multiple styles.Props maps into one, with later styles overriding earlier ones.
+func Merge(styleMaps ...Props) Props {
+	mergedStyles := Props{}
+	for _, styleMap := range styleMaps {
+		for key, value := range styleMap {
+			mergedStyles[key] = value
+		}
+	}
+	return mergedStyles
+}

styles/utils_test.go

@@ -0,0 +1,56 @@
+package styles
+
+import (
+	"github.com/stretchr/testify/assert"
+	"testing"
+)
+
+func TestMerge(t *testing.T) {
+	baseStyle := Props{
+		Width: "100px",
+		Color: "blue",
+	}
+
+	additionalStyle := Props{
+		Color:           "red", // This should override the blue color in baseStyle
+		BackgroundColor: "yellow",
+	}
+
+	expectedMergedStyle := Props{
+		Width:           "100px",
+		Color:           "red",
+		BackgroundColor: "yellow",
+	}
+
+	mergedStyle := Merge(baseStyle, additionalStyle)
+
+	assert.Equal(t, expectedMergedStyle, mergedStyle)
+}
+
+func TestMergeThreeStyles(t *testing.T) {
+	baseStyle := Props{
+		Padding: "10px",
+		Margin:  "5px",
+	}
+
+	secondaryStyle := Props{
+		Margin: "10px", // This should override the baseStyle margin
+		Color:  "red",
+	}
+
+	tertiaryStyle := Props{
+		Color:  "blue", // This should override the secondaryStyle color
+		Border: "1px solid black",
+	}
+
+	mergedStyle := Merge(baseStyle, secondaryStyle, tertiaryStyle)
+
+	expectedStyle := Props{
+		"padding": "10px",
+		"margin":  "10px", // From secondaryStyle
+		"color":   "blue", // From tertiaryStyle
+		"border":  "1px solid black",
+	}
+
+	assert.Equal(t, expectedStyle, mergedStyle)
+}