GT2/Ejectable/node_modules/inline-style-prefixer/es/plugins/transition.js

75 lines
2.3 KiB
JavaScript

import hyphenateProperty from 'css-in-js-utils/lib/hyphenateProperty';
import isPrefixedValue from 'css-in-js-utils/lib/isPrefixedValue';
import capitalizeString from '../utils/capitalizeString';
var properties = {
transition: true,
transitionProperty: true,
WebkitTransition: true,
WebkitTransitionProperty: true,
MozTransition: true,
MozTransitionProperty: true
};
var prefixMapping = {
Webkit: '-webkit-',
Moz: '-moz-',
ms: '-ms-'
};
function prefixValue(value, propertyPrefixMap) {
if (isPrefixedValue(value)) {
return value;
}
// only split multi values, not cubic beziers
var multipleValues = value.split(/,(?![^()]*(?:\([^()]*\))?\))/g);
for (var i = 0, len = multipleValues.length; i < len; ++i) {
var singleValue = multipleValues[i];
var values = [singleValue];
for (var property in propertyPrefixMap) {
var dashCaseProperty = hyphenateProperty(property);
if (singleValue.indexOf(dashCaseProperty) > -1 && dashCaseProperty !== 'order') {
var prefixes = propertyPrefixMap[property];
for (var j = 0, pLen = prefixes.length; j < pLen; ++j) {
// join all prefixes and create a new value
values.unshift(singleValue.replace(dashCaseProperty, prefixMapping[prefixes[j]] + dashCaseProperty));
}
}
}
multipleValues[i] = values.join(',');
}
return multipleValues.join(',');
}
export default function transition(property, value, style, propertyPrefixMap) {
// also check for already prefixed transitions
if (typeof value === 'string' && properties.hasOwnProperty(property)) {
var outputValue = prefixValue(value, propertyPrefixMap);
// if the property is already prefixed
var webkitOutput = outputValue.split(/,(?![^()]*(?:\([^()]*\))?\))/g).filter(function (val) {
return !/-moz-|-ms-/.test(val);
}).join(',');
if (property.indexOf('Webkit') > -1) {
return webkitOutput;
}
var mozOutput = outputValue.split(/,(?![^()]*(?:\([^()]*\))?\))/g).filter(function (val) {
return !/-webkit-|-ms-/.test(val);
}).join(',');
if (property.indexOf('Moz') > -1) {
return mozOutput;
}
style['Webkit' + capitalizeString(property)] = webkitOutput;
style['Moz' + capitalizeString(property)] = mozOutput;
return outputValue;
}
}