add 'none' keyword to PISS shadow definiton that equals empty array

4 files changed, 14 insertions, 4 deletions

diff --git a/src/components/button_unstyled.style.js b/src/components/button_unstyled.style.js
index 435f9cc6..65b5c57b 100644
--- a/src/components/button_unstyled.style.js
+++ b/src/components/button_unstyled.style.js
@@ -16,7 +16,8 @@ export default {
     {
       directives: {
         background: '#ffffff',
-        opacity: 0
+        opacity: 0,
+        shadow: []
       }
     },
     {
diff --git a/src/components/panel_header.style.js b/src/components/panel_header.style.js
index 010e42cd..32464bc5 100644
--- a/src/components/panel_header.style.js
+++ b/src/components/panel_header.style.js
@@ -16,7 +16,8 @@ export default {
       component: 'PanelHeader',
       directives: {
         backgroundNoCssColor: 'yes',
-        background: '--fg'
+        background: '--fg',
+        shadow: []
       }
     }
   ]
diff --git a/src/services/theme_data/iss_deserializer.js b/src/services/theme_data/iss_deserializer.js
index 5d71f35f..909e9411 100644
--- a/src/services/theme_data/iss_deserializer.js
+++ b/src/services/theme_data/iss_deserializer.js
@@ -138,7 +138,11 @@ export const deserialize = (input) => {
         const [property, value] = d.split(':')
         let realValue = value.trim()
         if (property === 'shadow') {
-          realValue = value.split(',').map(v => parseShadow(v.trim()))
+          if (realValue === 'none') {
+            realValue = []
+          } else {
+            realValue = value.split(',').map(v => parseShadow(v.trim()))
+          }
         } if (!Number.isNaN(Number(value))) {
           realValue = Number(value)
         }
diff --git a/src/services/theme_data/iss_serializer.js b/src/services/theme_data/iss_serializer.js
index 959852b7..8b7cf5d8 100644
--- a/src/services/theme_data/iss_serializer.js
+++ b/src/services/theme_data/iss_serializer.js
@@ -32,7 +32,11 @@ export const serialize = (ruleset) => {
       } else {
         switch (directive) {
           case 'shadow':
-            return `  ${directive}: ${value.map(serializeShadow).join(', ')}`
+            if (value.length > 0) {
+              return `  ${directive}: ${value.map(serializeShadow).join(', ')}`
+            } else {
+              return `  ${directive}: none`
+            }
           default:
             return `  ${directive}: ${value}`
         }