Allow multiple font variant values to be used, fixes #175

Author: finnp

src/__tests__/fontVariant.js

@@ -5,3 +5,11 @@ it('transforms font variant as an array', () => {
     fontVariant: ['tabular-nums'],
   })
 })
+
+it('transforms multiple font variant as an array', () => {
+  expect(
+    transformCss([['font-variant', 'tabular-nums oldstyle-nums']])
+  ).toEqual({
+    fontVariant: ['tabular-nums', 'oldstyle-nums'],
+  })
+})

src/transforms/index.js

@@ -6,6 +6,7 @@ import {
   UNSUPPORTED_LENGTH_UNIT,
   PERCENT,
   AUTO,
+  SPACE,
 } from '../tokenTypes'
 import border from './border'
 import boxShadow from './boxShadow'
@@ -39,9 +40,18 @@ const margin = directionFactory({
   prefix: 'margin',
 })
 const padding = directionFactory({ prefix: 'padding' })
-const fontVariant = tokenStream => ({
-  fontVariant: [tokenStream.expect(IDENT)],
-})
+const fontVariant = tokenStream => {
+  const values = [tokenStream.expect(IDENT)]
+
+  while (tokenStream.hasTokens()) {
+    tokenStream.expect(SPACE)
+    values.push(tokenStream.expect(IDENT))
+  }
+
+  return {
+    fontVariant: values,
+  }
+}
 const fontWeight = tokenStream => ({
   fontWeight: tokenStream.expect(WORD), // Also match numbers as strings
 })