code update and new generator

generateDefaultData.js

@@ -0,0 +1,24 @@
+import generateData from './modules/generator'
+
+const defaultBrowserSupport = {
+  chrome: 46,
+  android: 4,
+  firefox: 40,
+  ios_saf: 8,
+  safari: 8,
+  ie: 11,
+  ie_mob: 11,
+  edge: 12,
+  opera: 16,
+  op_mini: 12,
+  and_uc: 9,
+  and_chr: 46
+}
+
+generateData(defaultBrowserSupport, {
+  staticPath: `${__dirname}/modules/static/staticData.js`,
+  dynamicPath: `${__dirname}/modules/dynamic/dynamicData.js`,
+  compatibility: false,
+  prefixData: true,
+  plugins: false
+})

modules/dynamic/createPrefixer.js

@@ -5,9 +5,12 @@ import addNewValuesOnly from '../utils/addNewValuesOnly'
 import isObject from '../utils/isObject'
 import prefixValue from '../utils/prefixValue'
 
+type DynamicData = {
+  prefixMap: Object,
+  plugins: Array<Function>
+};
 export default function createPrefixer(
-  propertyPrefixMap: Object,
-  plugins: ?Array<Function> = [],
+  { prefixMap, plugins }: DynamicData,
   fallback: ?Function = style => style
 ) {
   return class Prefixer {
@@ -38,8 +41,7 @@ export default function createPrefixer(
         return false
       }
 
-      const prefixData = this._browserInfo.browserName &&
-        propertyPrefixMap[this._browserInfo.browserName]
+      const prefixData = this._browserInfo.browserName && prefixMap[this._browserInfo.browserName]
       if (prefixData) {
         this._requiresPrefix = {}
 

modules/dynamic/index.js

@@ -1,8 +1,5 @@
 import createPrefixer from './createPrefixer'
 
-import fallback from '../static'
-import propertyPrefixMap from './propertyPrefixMap'
-
 import cursor from './plugins/cursor'
 import crossFade from './plugins/crossFade'
 import filter from './plugins/filter'
@@ -27,4 +24,14 @@ const plugins = [
   flex
 ]
 
-export default createPrefixer(propertyPrefixMap, plugins, fallback)
+import prefixAll from '../static'
+import { prefixMap } from './dynamicData'
+
+const Prefixer = createPrefixer(
+  {
+    prefixMap,
+    plugins
+  },
+  prefixAll
+)
+export default Prefixer

modules/dynamic/plugins/flexboxIE.js

@@ -26,13 +26,18 @@ export default function flexboxIE(
   property: string,
   value: any,
   style: Object,
-  { browserName, browserVersion, cssPrefix, keepUnprefixed, requiresPrefix }: PluginMetaData
+  {
+    browserName,
+    browserVersion,
+    cssPrefix,
+    keepUnprefixed,
+    requiresPrefix
+  }:
+PluginMetaData
 ): ?Array<any> | ?any {
   if (
     (alternativeProps[property] ||
-      property === 'display' &&
-        typeof value === 'string' &&
-        value.indexOf('flex') > -1) &&
+      property === 'display' && typeof value === 'string' && value.indexOf('flex') > -1) &&
       ((browserName === 'ie_mob' || browserName === 'ie') && browserVersion === 10)
   ) {
     delete requiresPrefix[property]
@@ -41,11 +46,7 @@ export default function flexboxIE(
       delete style[property]
     }
     if (property === 'display' && alternativeValues[value]) {
-      return getPrefixedValue(
-        cssPrefix + alternativeValues[value],
-        value,
-        keepUnprefixed
-      )
+      return getPrefixedValue(cssPrefix + alternativeValues[value], value, keepUnprefixed)
     }
     if (alternativeProps[property]) {
       style[alternativeProps[property]] = alternativeValues[value] || value

modules/dynamic/plugins/flexboxOld.js

@@ -35,17 +35,21 @@ export default function flexboxOld(
   property: string,
   value: any,
   style: Object,
-  { browserName, browserVersion, cssPrefix, keepUnprefixed, requiresPrefix }: PluginMetaData
+  {
+    browserName,
+    browserVersion,
+    cssPrefix,
+    keepUnprefixed,
+    requiresPrefix
+  }:
+PluginMetaData
 ): ?Array<any> | ?any {
   if (
     (properties.indexOf(property) > -1 ||
-      property === 'display' &&
-        typeof value === 'string' &&
-        value.indexOf('flex') > -1) &&
+      property === 'display' && typeof value === 'string' && value.indexOf('flex') > -1) &&
       (browserName === 'firefox' && browserVersion < 22 ||
         browserName === 'chrome' && browserVersion < 21 ||
-        (browserName === 'safari' || browserName === 'ios_saf') &&
-          browserVersion <= 6.1 ||
+        (browserName === 'safari' || browserName === 'ios_saf') && browserVersion <= 6.1 ||
         browserName === 'android' && browserVersion < 4.4 ||
         browserName === 'and_uc')
   ) {
@@ -67,11 +71,7 @@ export default function flexboxOld(
       }
     }
     if (property === 'display' && alternativeValues[value]) {
-      return getPrefixedValue(
-        cssPrefix + alternativeValues[value],
-        value,
-        keepUnprefixed
-      )
+      return getPrefixedValue(cssPrefix + alternativeValues[value], value, keepUnprefixed)
     }
     if (alternativeProps[property]) {
       style[alternativeProps[property]] = alternativeValues[value] || value

modules/dynamic/plugins/index.js

@@ -25,18 +25,3 @@ export default [
   flexboxOld,
   flex
 ]
-
-export {
-  position,
-  calc,
-  imageSet,
-  crossFade,
-  filter,
-  cursor,
-  sizing,
-  gradient,
-  transition,
-  flexboxIE,
-  flexboxOld,
-  flex
-}

modules/dynamic/plugins/transition.js

@@ -1,5 +1,5 @@
 /* @flow */
-import hyphenateStyleName from 'hyphenate-style-name'
+import hyphenateProperty from 'css-in-js-utils/lib/hyphenateProperty'
 import type { PluginMetaData } from '../../../flowtypes/PluginMetaData'
 
 const properties = {
@@ -22,7 +22,7 @@ export default function transition(
   if (typeof value === 'string' && properties[property]) {
     // memoize the prefix array for later use
     if (!requiresPrefixDashCased) {
-      requiresPrefixDashCased = Object.keys(requiresPrefix).map(prop => hyphenateStyleName(prop))
+      requiresPrefixDashCased = Object.keys(requiresPrefix).map(prop => hyphenateProperty(prop))
     }
 
     // only split multi values, not cubic beziers

modules/generator/generateDynamicPrefixMap.js

@@ -0,0 +1,77 @@
+/* @flow */
+import { getSupport } from 'caniuse-api'
+
+import propertyMap from './maps/propertyMap'
+
+const prefixBrowserMap = {
+  chrome: 'Webkit',
+  safari: 'Webkit',
+  firefox: 'Moz',
+  opera: 'Webkit',
+  ie: 'ms',
+  edge: 'ms',
+  ios_saf: 'Webkit',
+  android: 'Webkit',
+  and_chr: 'Webkit',
+  and_uc: 'Webkit',
+  op_mini: 'Webkit',
+  ie_mob: 'ms'
+}
+
+const browsers = Object.keys(prefixBrowserMap)
+
+// remove flexprops from IE
+const flexPropsIE = [
+  'alignContent',
+  'alignSelf',
+  'alignItems',
+  'justifyContent',
+  'order',
+  'flexGrow',
+  'flexShrink',
+  'flexBasis'
+]
+
+function filterAndRemoveIfEmpty(map: Object, property: string, filter: Function): void {
+  map[property] = map[property].filter(filter)
+
+  if (map[property].length === 0) {
+    delete map[property]
+  }
+}
+
+export default function generateDynamicPrefixMap(browserList: Object): Object {
+  const prefixMap = {}
+
+  for (let i = 0, len = browsers.length; i < len; ++i) {
+    const browser = browsers[i]
+    if (!prefixMap[browser]) {
+      prefixMap[browser] = {}
+    }
+
+    for (const keyword in propertyMap) {
+      const keywordProperties = [].concat(propertyMap[keyword])
+      const versions = getSupport(keyword)
+
+      for (let j = 0, kLen = keywordProperties.length; j < kLen; ++j) {
+        if (versions[browser].x >= browserList[browser]) {
+          prefixMap[browser][keywordProperties[j]] = versions[browser].x
+        }
+      }
+    }
+  }
+
+  prefixMap.ie = {
+    ...prefixMap.ie,
+    ...prefixMap.ie_mob
+  }
+
+  delete prefixMap.ie_mob
+
+  // remove flexProps from IE due to alternative syntax
+  for (let i = 0, len = flexPropsIE.length; i < len; ++i) {
+    delete prefixMap.ie[flexPropsIE[i]]
+  }
+
+  return prefixMap
+}