re-set borderStyle for directional shorthands

Author: quantizor

src/__tests__/border.js

@@ -68,30 +68,30 @@ it('transforms bottom direction border shorthand', () => {
   expect(transformCss([['border-bottom', '2px dashed #f00']])).toEqual({
     borderBottomWidth: 2,
     borderBottomColor: '#f00',
-    borderBottomStyle: 'dashed',
+    borderStyle: 'dashed',
   })
 })
 
 it('transforms left direction border shorthand', () => {
   expect(transformCss([['border-left', '2px dashed #f00']])).toEqual({
     borderLeftWidth: 2,
     borderLeftColor: '#f00',
-    borderLeftStyle: 'dashed',
+    borderStyle: 'dashed',
   })
 })
 
 it('transforms right direction border shorthand', () => {
   expect(transformCss([['border-right', '2px dashed #f00']])).toEqual({
     borderRightWidth: 2,
     borderRightColor: '#f00',
-    borderRightStyle: 'dashed',
+    borderStyle: 'dashed',
   })
 })
 
 it('transforms top direction border shorthand', () => {
   expect(transformCss([['border-top', '2px dashed #f00']])).toEqual({
     borderTopWidth: 2,
     borderTopColor: '#f00',
-    borderTopStyle: 'dashed',
+    borderStyle: 'dashed',
   })
 })

src/transforms/index.js

@@ -33,7 +33,7 @@ const createBorderFactory = (direction = '') =>
       tokens: [COLOR],
       default: 'black',
     },
-    [`border${direction}Style`]: {
+    borderStyle: {
       tokens: [regExpToken(/^(solid|dashed|dotted)$/)],
       default: 'solid',
     },