You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
91 lines
2.7 KiB
91 lines
2.7 KiB
'use strict';
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = transition;
|
|
|
|
var _hyphenateProperty = require('css-in-js-utils/lib/hyphenateProperty');
|
|
|
|
var _hyphenateProperty2 = _interopRequireDefault(_hyphenateProperty);
|
|
|
|
var _isPrefixedValue = require('css-in-js-utils/lib/isPrefixedValue');
|
|
|
|
var _isPrefixedValue2 = _interopRequireDefault(_isPrefixedValue);
|
|
|
|
var _capitalizeString = require('../utils/capitalizeString');
|
|
|
|
var _capitalizeString2 = _interopRequireDefault(_capitalizeString);
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
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 ((0, _isPrefixedValue2.default)(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 = (0, _hyphenateProperty2.default)(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(',');
|
|
}
|
|
|
|
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' + (0, _capitalizeString2.default)(property)] = webkitOutput;
|
|
style['Moz' + (0, _capitalizeString2.default)(property)] = mozOutput;
|
|
return outputValue;
|
|
}
|
|
} |