From ba1a81305100d3302aab2f0cc09ed245ec1a6856 Mon Sep 17 00:00:00 2001
From: estrattonbailey <ericstrattonbailey@gmail.com>
Date: Tue, 21 Dec 2021 15:50:10 -0600
Subject: [PATCH] fix: custom media overrides

fixes #7
---
 lib/__tests__/index.ts | 21 ++++++++++++++++++++-
 lib/index.ts           | 11 ++++++++---
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/lib/__tests__/index.ts b/lib/__tests__/index.ts
index 0e32827..21c66bb 100644
--- a/lib/__tests__/index.ts
+++ b/lib/__tests__/index.ts
@@ -393,7 +393,7 @@ test('flush', () => {
 })
 
 test('injectGlobal', () => {
-  const { injectGlobal, flush } = hypostyle()
+  const { injectGlobal, flush } = hypostyle({})
   injectGlobal({ html: { color: 'blue' } })
   const sheet = flush()
   assert.ok(sheet.includes('color:blue'))
@@ -495,4 +495,23 @@ test('prefix', () => {
   assert.equal(/hypo/.test(sheet), true)
 })
 
+/**
+ * @see https://github.com/sure-thing/hypostyle/issues/7
+ */
+test('issue #7', async () => {
+  const { style } = hypostyle(defaults)
+
+  const styles = style({
+    color: ['blue', 'red'],
+    [`@media (min-width: ${defaults.breakpoints[0]})`]: {
+      background: 'tomato',
+    },
+  })
+
+  assert.equal(styles, {
+    color: 'blue',
+    '@media (min-width: 400px)': { color: 'red', background: 'tomato' },
+  })
+})
+
 test.run()
diff --git a/lib/index.ts b/lib/index.ts
index cd757c8..3895ec7 100644
--- a/lib/index.ts
+++ b/lib/index.ts
@@ -156,9 +156,14 @@ function style(props: HypostyleObject, theme: Theme): CssLikeObject {
 
         props[prop] = arr
       } else {
-        // continue, nested style object
-        styles[prop] = style(mixedObject, theme)
-        continue // continue main loop
+        /*
+         * Safely merge in nested prop — there may be duplicate keys, like
+         * after shorthand expansion or a custom media query block
+         */
+        var nested = {}
+        nested[prop] = style(mixedObject, theme)
+        merge(styles, nested)
+        continue // continue, nested style object
       }
     }