chore: add mobile app

This commit is contained in:
2026-02-07 22:33:02 +01:00
parent db34640acc
commit e89384ad4e
29327 changed files with 3886944 additions and 12 deletions
+22
View File
@@ -0,0 +1,22 @@
The MIT License (MIT)
Copyright (c) 2015 Robin Frischmann
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+105
View File
@@ -0,0 +1,105 @@
# inline-style-prefixer
A small, simple and fast vendor prefixer from JavaScript style object.
<img alt="npm downloads" src="https://img.shields.io/npm/dm/inline-style-prefixer.svg"> <img alt="gzipped size" src="https://img.shields.io/bundlephobia/minzip/inline-style-prefixer.svg?colorB=4c1&label=gzipped%20size"> <img alt="npm version" src="https://badge.fury.io/js/inline-style-prefixer.svg">
## Installation
```sh
yarn add inline-style-prefixer
```
If you're still using npm, you may run `npm i --save inline-style-prefixer`.
## Browser Support
It supports all major browsers with the following versions. For other, unsupported browses, we automatically use a fallback.
- Chrome: 55+
- Android (Chrome): 55+
- Android (Stock Browser): 5+
- Android (UC): 11+
- Firefox: 52+
- Safari: 13+
- iOS (Safari): 13+
- Opera: 30+
- Opera (Mini): 12+
- IE: 11+
- IE (Mobile): 11+
- Edge: 12+
It will **only** add prefixes if a property still needs them in one of the above mentioned versions.<br> Therefore, e.g. `border-radius` will not be prefixed at all.
> **Need to support legacy browser versions?**<br>
> Don't worry - we got you covered. Check [this guide](https://github.com/rofrischmann/inline-style-prefixer/blob/master/docs/guides/CustomPrefixer.md).
## Usage
```javascript
import { prefix } from 'inline-style-prefixer'
const style = {
transition: '200ms all linear',
boxSizing: 'border-box',
display: 'flex',
color: 'blue'
}
const output = prefix(style)
output === {
WebkitTransition: '200ms all linear',
transition: '200ms all linear',
MozBoxSizing: 'border-box',
boxSizing: 'border-box',
display: [ '-webkit-box', '-moz-box', '-ms-flexbox', '-webkit-flex', 'flex' ],
color: 'blue'
}
```
## Usage with TypeScript
You can use TypeScript definition from [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/inline-style-prefixer) using [@types/inline-style-prefixer](https://www.npmjs.com/package/@types/inline-style-prefixer)
```sh
yarn add @types/inline-style-prefixer
# alternatively use npm
npm i --save @types/inline-style-prefixer
```
## Documentation
If you got any issue using this prefixer, please first check the FAQ's. Most cases are already covered and provide a solid solution.
- [Usage Guides](https://inline-style-prefixer.js.org/docs/UsageGuides.html)
- [Data Reference](https://inline-style-prefixer.js.org/docs/DataReference.html)
- [API Reference](https://inline-style-prefixer.js.org/docs/API.html)
## Community
Here are some popular users of this library:
- [Aphrodite](https://github.com/Khan/aphrodite)
- [Fela](https://github.com/rofrischmann/fela)
- [Glamor](https://github.com/threepointone/glamor)
- [Material UI](https://github.com/callemall/material-ui)
- [nano-css](https://github.com/streamich/nano-css)
- [Radium](https://github.com/FormidableLabs/radium)
- [react-native-web](https://github.com/necolas/react-native-web)
- [styled-components](https://github.com/styled-components/styled-components)
- [Styletron](https://github.com/rtsao/styletron)
> PS: Feel free to add your solution!
## Support
Join us on [Gitter](https://gitter.im/rofrischmann/fela). We highly appreciate any contribution.<br>
We also love to get feedback.
## License
**inline-style-prefixer** is licensed under the [MIT License](http://opensource.org/licenses/MIT).<br>
Documentation is licensed under [Creative Common License](http://creativecommons.org/licenses/by/4.0/).<br>
Created with ♥ by [@rofrischmann](http://rofrischmann.de) and all contributors.
+48
View File
@@ -0,0 +1,48 @@
import prefixProperty from './utils/prefixProperty';
import prefixValue from './utils/prefixValue';
import addNewValuesOnly from './utils/addNewValuesOnly';
import isObject from './utils/isObject';
export default function createPrefixer(_ref) {
var prefixMap = _ref.prefixMap,
plugins = _ref.plugins;
return function prefix(style) {
for (var property in style) {
var value = style[property];
// handle nested objects
if (isObject(value)) {
style[property] = prefix(value);
// handle array values
} else if (Array.isArray(value)) {
var combinedValue = [];
for (var i = 0, len = value.length; i < len; ++i) {
var processedValue = prefixValue(plugins, property, value[i], style, prefixMap);
addNewValuesOnly(combinedValue, processedValue || value[i]);
}
// only modify the value if it was touched
// by any plugin to prevent unnecessary mutations
if (combinedValue.length > 0) {
style[property] = combinedValue;
}
} else {
var _processedValue = prefixValue(plugins, property, value, style, prefixMap);
// only modify the value if it was touched
// by any plugin to prevent unnecessary mutations
if (_processedValue) {
style[property] = _processedValue;
}
style = prefixProperty(prefixMap, property, style);
}
}
return style;
};
}
+51
View File
@@ -0,0 +1,51 @@
import crossFade from 'inline-style-prefixer/lib/plugins/crossFade';
import imageSet from 'inline-style-prefixer/lib/plugins/imageSet';
import sizing from 'inline-style-prefixer/lib/plugins/sizing';
import transition from 'inline-style-prefixer/lib/plugins/transition';
var w = ['Webkit'];
var m = ['Moz'];
var ms = ['ms'];
var wm = ['Webkit', 'Moz'];
var wms = ['Webkit', 'ms'];
var wmms = ['Webkit', 'Moz', 'ms'];
export default {
plugins: [crossFade, imageSet, sizing, transition],
prefixMap: {
textEmphasisPosition: w,
textEmphasis: w,
textEmphasisStyle: w,
textEmphasisColor: w,
boxDecorationBreak: w,
maskImage: w,
maskMode: w,
maskRepeat: w,
maskPosition: w,
maskClip: w,
maskOrigin: w,
maskSize: w,
maskComposite: w,
mask: w,
maskBorderSource: w,
maskBorderMode: w,
maskBorderSlice: w,
maskBorderWidth: w,
maskBorderOutset: w,
maskBorderRepeat: w,
maskBorder: w,
maskType: w,
appearance: w,
userSelect: w,
backdropFilter: w,
clipPath: w,
hyphens: w,
textOrientation: w,
tabSize: m,
fontKerning: w,
textSizeAdjust: w,
textDecorationStyle: w,
textDecorationSkip: w,
textDecorationLine: w,
textDecorationColor: w
}
};
@@ -0,0 +1,21 @@
import pluginMap from './maps/pluginMap';
export default function getRecommendedPlugins(browserList) {
var recommendedPlugins = {};
for (var plugin in pluginMap) {
var browserSupportByPlugin = pluginMap[plugin];
for (var browser in browserSupportByPlugin) {
if (browserList.hasOwnProperty(browser)) {
var browserVersion = browserSupportByPlugin[browser];
if (browserList[browser] < browserVersion) {
recommendedPlugins[plugin] = true;
}
}
}
}
return Object.keys(recommendedPlugins);
}
@@ -0,0 +1,78 @@
import { getSupport } from 'caniuse-api';
import propertyMap from './maps/propertyMap';
var 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'
// remove flexprops from IE
};var flexPropsIE = ['alignContent', 'alignSelf', 'alignItems', 'justifyContent', 'order', 'flexGrow', 'flexShrink', 'flexBasis'];
function filterAndRemoveIfEmpty(map, property, filter) {
if (map[property]) {
map[property] = map[property].filter(filter);
if (map[property].length === 0) {
delete map[property];
}
}
}
export default function generatePrefixMap(browserList) {
var prefixMap = {};
for (var browser in prefixBrowserMap) {
var prefix = prefixBrowserMap[browser];
for (var keyword in propertyMap) {
var keywordProperties = [].concat(propertyMap[keyword]);
var versions = getSupport(keyword);
for (var i = 0, len = keywordProperties.length; i < len; ++i) {
if (versions[browser]) {
if (versions[browser].x >= browserList[browser]) {
var property = keywordProperties[i];
if (!prefixMap[property]) {
prefixMap[property] = [];
}
if (prefixMap[property].indexOf(prefix) === -1) {
prefixMap[property].push(prefix);
}
}
}
}
}
}
// remove flexProps from IE and Firefox due to alternative syntax
for (var _i = 0, _len = flexPropsIE.length; _i < _len; ++_i) {
filterAndRemoveIfEmpty(prefixMap, flexPropsIE[_i], function (prefix) {
return prefix !== 'ms' && prefix !== 'Moz';
});
}
// remove transition from Moz and Webkit as they are handled
// specially by the transition plugins
filterAndRemoveIfEmpty(prefixMap, 'transition', function (prefix) {
return prefix !== 'Moz' && prefix !== 'Webkit';
});
// remove WebkitFlexDirection as it does not exist
filterAndRemoveIfEmpty(prefixMap, 'flexDirection', function (prefix) {
return prefix !== 'Moz';
});
return prefixMap;
}
@@ -0,0 +1,69 @@
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
import generatePrefixMap from './generatePrefixMap';
import generatePluginList from './generatePluginList';
function generateImportString(plugin, compatibility) {
if (compatibility) {
return 'var ' + plugin + ' = require(\'inline-style-prefixer/lib/plugins/' + plugin + '\')';
}
return 'import ' + plugin + ' from \'inline-style-prefixer/lib/plugins/' + plugin + '\'';
}
export function generateFile(prefixMap, pluginList, compatibility) {
var pluginImports = pluginList.map(function (plugin) {
return generateImportString(plugin, compatibility);
}).join('\n');
var moduleExporter = compatibility ? 'module.exports = ' : 'export default';
var pluginExport = '[' + pluginList.join(',') + ']';
var prefixMapExport = JSON.stringify(prefixMap);
var prefixVariables = ['var w = ["Webkit"];', 'var m = ["Moz"];', 'var ms = ["ms"];', 'var wm = ["Webkit","Moz"];', 'var wms = ["Webkit","ms"];', 'var wmms = ["Webkit","Moz","ms"];'].join('\n');
return pluginImports + '\n' + prefixVariables + '\n\n' + moduleExporter + ' {\n plugins: ' + pluginExport + ',\n prefixMap: ' + prefixMapExport.replace(/\["Webkit"\]/g, 'w').replace(/\["Moz"\]/g, 'm').replace(/\["ms"\]/g, 'ms').replace(/\["Webkit","Moz"\]/g, 'wm').replace(/\["Webkit","ms"\]/g, 'wms').replace(/\["Webkit","Moz","ms"\]/g, 'wmms') + '\n}';
}
function saveFile(fileContent, path) {
/* eslint-disable global-require */
var fs = require('fs');
/* eslint-enable global-require */
fs.writeFile(path, fileContent, function (err) {
if (err) {
throw err;
}
console.log('Successfully saved data to "' + path + '".');
});
}
var defaultOptions = {
prefixMap: true,
plugins: true,
compatibility: false
};
export default function generateData(browserList) {
var userOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = _extends({}, defaultOptions, userOptions);
var compatibility = options.compatibility,
plugins = options.plugins,
path = options.path,
prefixMap = options.prefixMap;
var requiredPrefixMap = prefixMap ? generatePrefixMap(browserList) : {};
var requiredPlugins = plugins ? generatePluginList(browserList) : [];
if (path) {
saveFile(generateFile(requiredPrefixMap, requiredPlugins, compatibility), path);
}
return {
prefixMap: requiredPrefixMap,
plugins: requiredPlugins
};
}
@@ -0,0 +1,95 @@
// values are "up-to"
var maximumVersion = 9999;
export default {
calc: {
firefox: 15,
chrome: 25,
safari: 6.1,
ios_saf: 7
},
crossFade: {
chrome: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
ios_saf: 10,
safari: 10
},
cursor: {
firefox: 24,
chrome: 37,
safari: 9,
opera: 24
},
filter: {
ios_saf: 9.3,
safari: 9.1
},
flex: {
chrome: 29,
safari: 9,
ios_saf: 9,
opera: 16
},
flexboxIE: {
ie: 11
},
flexboxOld: {
firefox: 22,
chrome: 21,
safari: 6.2,
ios_saf: 6.2,
android: 4.4
},
gradient: {
firefox: 16,
chrome: 26,
safari: 7,
ios_saf: 7,
opera: 12.1,
op_mini: 12.1,
android: 4.4
},
grid: {
edge: 16,
ie: 11
},
imageSet: {
chrome: maximumVersion,
safari: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
ios_saf: maximumVersion
},
logical: {
chrome: 68,
safari: 12,
opera: 55,
and_chr: 66,
ios_saf: 12,
firefox: 40
},
position: {
safari: 12.1,
ios_saf: 12.4
},
sizing: {
chrome: 46,
safari: 10.1,
opera: 33,
and_chr: 53,
ios_saf: maximumVersion
},
transition: {
chrome: maximumVersion,
safari: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
and_uc: maximumVersion,
ios_saf: maximumVersion,
msie: maximumVersion,
edge: maximumVersion,
firefox: maximumVersion,
op_mini: maximumVersion
}
};
@@ -0,0 +1,38 @@
export default {
'border-radius': 'borderRadius',
'border-image': ['borderImage', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'],
flexbox: ['flex', 'flexBasis', 'flexDirection', 'flexGrow', 'flexFlow', 'flexShrink', 'flexWrap', 'alignContent', 'alignItems', 'alignSelf', 'justifyContent', 'order'],
'css-transitions': ['transition', 'transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'],
transforms2d: ['transform', 'transformOrigin', 'transformOriginX', 'transformOriginY'],
transforms3d: ['backfaceVisibility', 'perspective', 'perspectiveOrigin', 'transform', 'transformOrigin', 'transformStyle', 'transformOriginX', 'transformOriginY', 'transformOriginZ'],
'css-animation': ['animation', 'animationDelay', 'animationDirection', 'animationFillMode', 'animationDuration', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'],
'css-appearance': 'appearance',
'user-select-none': 'userSelect',
'css-backdrop-filter': 'backdropFilter',
'css3-boxsizing': 'boxSizing',
'font-kerning': 'fontKerning',
'css-exclusions': ['wrapFlow', 'wrapThrough', 'wrapMargin'],
'css-snappoints': ['scrollSnapType', 'scrollSnapPointsX', 'scrollSnapPointsY', 'scrollSnapDestination', 'scrollSnapCoordinate'],
'text-emphasis': ['textEmphasisPosition', 'textEmphasis', 'textEmphasisStyle', 'textEmphasisColor'],
'css-text-align-last': 'textAlignLast',
'css-boxdecorationbreak': 'boxDecorationBreak',
'css-clip-path': 'clipPath',
'css-masks': ['maskImage', 'maskMode', 'maskRepeat', 'maskPosition', 'maskClip', 'maskOrigin', 'maskSize', 'maskComposite', 'mask', 'maskBorderSource', 'maskBorderMode', 'maskBorderSlice', 'maskBorderWidth', 'maskBorderOutset', 'maskBorderRepeat', 'maskBorder', 'maskType'],
'css-touch-action': 'touchAction',
'text-size-adjust': 'textSizeAdjust',
'text-decoration': ['textDecorationStyle', 'textDecorationSkip', 'textDecorationLine', 'textDecorationColor'],
'css-shapes': ['shapeImageThreshold', 'shapeImageMargin', 'shapeImageOutside'],
'css3-tabsize': 'tabSize',
'css-filters': 'filter',
'css-resize': 'resize',
'css-hyphens': 'hyphens',
'css-regions': ['flowInto', 'flowFrom', 'breakBefore', 'breakAfter', 'breakInside', 'regionFragment'],
'object-fit': ['objectFit', 'objectPosition'],
'text-overflow': 'textOverflow',
'background-img-opts': ['backgroundClip', 'backgroundOrigin', 'backgroundSize'],
'font-feature': 'fontFeatureSettings',
'css-boxshadow': 'boxShadow',
multicolumn: ['breakAfter', 'breakBefore', 'breakInside', 'columnCount', 'columnFill', 'columnGap', 'columnRule', 'columnRuleColor', 'columnRuleStyle', 'columnRuleWidth', 'columns', 'columnSpan', 'columnWidth', 'columnGap'],
'css-writing-mode': ['writingMode'],
'css-text-orientation': ['textOrientation']
};
+25
View File
@@ -0,0 +1,25 @@
import createPrefixer from './createPrefixer';
import data from './data';
import cursor from './plugins/cursor';
import crossFade from './plugins/crossFade';
import filter from './plugins/filter';
import flex from './plugins/flex';
import flexboxOld from './plugins/flexboxOld';
import gradient from './plugins/gradient';
import grid from './plugins/grid';
import imageSet from './plugins/imageSet';
import logical from './plugins/logical';
import position from './plugins/position';
import sizing from './plugins/sizing';
import transition from './plugins/transition';
var plugins = [crossFade, cursor, filter, flexboxOld, gradient, grid, imageSet, logical, position, sizing, transition, flex];
var prefix = createPrefixer({
prefixMap: data.prefixMap,
plugins: plugins
});
export { createPrefixer, prefix };
+12
View File
@@ -0,0 +1,12 @@
import { isPrefixedValue } from 'css-in-js-utils';
var CALC_REGEX = /calc\(/g;
var prefixes = ['-webkit-', '-moz-', ''];
export default function calc(property, value) {
if (typeof value === 'string' && !isPrefixedValue(value) && value.indexOf('calc(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(CALC_REGEX, prefix + 'calc(');
});
}
}
@@ -0,0 +1,13 @@
import { isPrefixedValue } from 'css-in-js-utils';
var CROSS_FADE_REGEX = /cross-fade\(/g;
// http://caniuse.com/#search=cross-fade
var prefixes = ['-webkit-', ''];
export default function crossFade(property, value) {
if (typeof value === 'string' && !isPrefixedValue(value) && value.indexOf('cross-fade(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(CROSS_FADE_REGEX, prefix + 'cross-fade(');
});
}
}
+16
View File
@@ -0,0 +1,16 @@
var prefixes = ['-webkit-', '-moz-', ''];
var values = {
'zoom-in': true,
'zoom-out': true,
grab: true,
grabbing: true
};
export default function cursor(property, value) {
if (property === 'cursor' && values.hasOwnProperty(value)) {
return prefixes.map(function (prefix) {
return prefix + value;
});
}
}
+13
View File
@@ -0,0 +1,13 @@
import { isPrefixedValue } from 'css-in-js-utils';
var FILTER_REGEX = /filter\(/g;
// http://caniuse.com/#feat=css-filter-function
var prefixes = ['-webkit-', ''];
export default function filter(property, value) {
if (typeof value === 'string' && !isPrefixedValue(value) && value.indexOf('filter(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(FILTER_REGEX, prefix + 'filter(');
});
}
}
+10
View File
@@ -0,0 +1,10 @@
var values = {
flex: ['-webkit-box', '-moz-box', '-ms-flexbox', '-webkit-flex', 'flex'],
'inline-flex': ['-webkit-inline-box', '-moz-inline-box', '-ms-inline-flexbox', '-webkit-inline-flex', 'inline-flex']
};
export default function flex(property, value) {
if (property === 'display' && values.hasOwnProperty(value)) {
return values[value];
}
}
@@ -0,0 +1,82 @@
var alternativeValues = {
'space-around': 'distribute',
'space-between': 'justify',
'flex-start': 'start',
'flex-end': 'end'
};
var alternativeProps = {
alignContent: 'msFlexLinePack',
alignSelf: 'msFlexItemAlign',
alignItems: 'msFlexAlign',
justifyContent: 'msFlexPack',
order: 'msFlexOrder',
flexGrow: 'msFlexPositive',
flexShrink: 'msFlexNegative',
flexBasis: 'msFlexPreferredSize'
// Full expanded syntax is flex-grow | flex-shrink | flex-basis.
};var flexShorthandMappings = {
auto: '1 1 auto',
inherit: 'inherit',
initial: '0 1 auto',
none: '0 0 auto',
unset: 'unset'
};
var isUnitlessNumber = /^\d+(\.\d+)?$/;
var logTag = 'inline-style-prefixer.flexboxIE plugin';
export default function flexboxIE(property, value, style) {
if (alternativeProps.hasOwnProperty(property)) {
style[alternativeProps[property]] = alternativeValues[value] || value;
}
if (property === 'flex') {
// For certain values we can do straight mappings based on the spec
// for the expansions.
if (Object.prototype.hasOwnProperty.call(flexShorthandMappings, value)) {
style.msFlex = flexShorthandMappings[value];
return;
}
// Here we have no direct mapping, so we favor looking for a
// unitless positive number as that will be the most common use-case.
if (isUnitlessNumber.test(value)) {
style.msFlex = value + ' 1 0%';
return;
}
if (typeof value === 'number' && value < 0) {
// ignore negative values;
console.warn(logTag + ': "flex: ' + value + '", negative values are not valid and will be ignored.');
return;
}
if (!value.split) {
console.warn(logTag + ': "flex: ' + value + '", value format are not detected, it will be remain as is');
style.msFlex = value;
return;
}
// The next thing we can look for is if there are multiple values.
var flexValues = value.split(/\s/);
// If we only have a single value that wasn't a positive unitless
// or a pre-mapped value, then we can assume it is a unit value.
switch (flexValues.length) {
case 1:
style.msFlex = '1 1 ' + value;
return;
case 2:
// If we have 2 units, then we expect that the first will
// always be a unitless number and represents flex-grow.
// The second unit will represent flex-shrink for a unitless
// value, or flex-basis otherwise.
if (isUnitlessNumber.test(flexValues[1])) {
style.msFlex = flexValues[0] + ' ' + flexValues[1] + ' 0%';
} else {
style.msFlex = flexValues[0] + ' 1 ' + flexValues[1];
}
return;
default:
style.msFlex = value;
}
}
}
@@ -0,0 +1,33 @@
var alternativeValues = {
'space-around': 'justify',
'space-between': 'justify',
'flex-start': 'start',
'flex-end': 'end',
'wrap-reverse': 'multiple',
wrap: 'multiple'
};
var alternativeProps = {
alignItems: 'WebkitBoxAlign',
justifyContent: 'WebkitBoxPack',
flexWrap: 'WebkitBoxLines',
flexGrow: 'WebkitBoxFlex'
};
export default function flexboxOld(property, value, style) {
if (property === 'flexDirection' && typeof value === 'string') {
if (value.indexOf('column') > -1) {
style.WebkitBoxOrient = 'vertical';
} else {
style.WebkitBoxOrient = 'horizontal';
}
if (value.indexOf('reverse') > -1) {
style.WebkitBoxDirection = 'reverse';
} else {
style.WebkitBoxDirection = 'normal';
}
}
if (alternativeProps.hasOwnProperty(property)) {
style[alternativeProps[property]] = alternativeValues[value] || value;
}
}
@@ -0,0 +1,14 @@
import isPrefixedValue from 'css-in-js-utils/lib/isPrefixedValue';
var prefixes = ['-webkit-', '-moz-', ''];
var values = /linear-gradient|radial-gradient|repeating-linear-gradient|repeating-radial-gradient/gi;
export default function gradient(property, value) {
if (typeof value === 'string' && !isPrefixedValue(value) && values.test(value)) {
return prefixes.map(function (prefix) {
return value.replace(values, function (grad) {
return prefix + grad;
});
});
}
}
+129
View File
@@ -0,0 +1,129 @@
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
function isSimplePositionValue(value) {
return typeof value === 'number' && !isNaN(value);
}
function isComplexSpanValue(value) {
return typeof value === 'string' && value.includes('/');
}
var alignmentValues = ['center', 'end', 'start', 'stretch'];
var displayValues = {
'inline-grid': ['-ms-inline-grid', 'inline-grid'],
grid: ['-ms-grid', 'grid']
};
var propertyConverters = {
alignSelf: function alignSelf(value, style) {
if (alignmentValues.indexOf(value) > -1) {
style.msGridRowAlign = value;
}
},
gridColumn: function gridColumn(value, style) {
if (isSimplePositionValue(value)) {
style.msGridColumn = value;
} else if (isComplexSpanValue(value)) {
var _value$split = value.split('/'),
_value$split2 = _slicedToArray(_value$split, 2),
start = _value$split2[0],
end = _value$split2[1];
propertyConverters.gridColumnStart(+start, style);
var _end$split = end.split(/ ?span /),
_end$split2 = _slicedToArray(_end$split, 2),
maybeSpan = _end$split2[0],
maybeNumber = _end$split2[1];
if (maybeSpan === '') {
propertyConverters.gridColumnEnd(+start + +maybeNumber, style);
} else {
propertyConverters.gridColumnEnd(+end, style);
}
} else {
propertyConverters.gridColumnStart(value, style);
}
},
gridColumnEnd: function gridColumnEnd(value, style) {
var msGridColumn = style.msGridColumn;
if (isSimplePositionValue(value) && isSimplePositionValue(msGridColumn)) {
style.msGridColumnSpan = value - msGridColumn;
}
},
gridColumnStart: function gridColumnStart(value, style) {
if (isSimplePositionValue(value)) {
style.msGridColumn = value;
}
},
gridRow: function gridRow(value, style) {
if (isSimplePositionValue(value)) {
style.msGridRow = value;
} else if (isComplexSpanValue(value)) {
var _value$split3 = value.split('/'),
_value$split4 = _slicedToArray(_value$split3, 2),
start = _value$split4[0],
end = _value$split4[1];
propertyConverters.gridRowStart(+start, style);
var _end$split3 = end.split(/ ?span /),
_end$split4 = _slicedToArray(_end$split3, 2),
maybeSpan = _end$split4[0],
maybeNumber = _end$split4[1];
if (maybeSpan === '') {
propertyConverters.gridRowEnd(+start + +maybeNumber, style);
} else {
propertyConverters.gridRowEnd(+end, style);
}
} else {
propertyConverters.gridRowStart(value, style);
}
},
gridRowEnd: function gridRowEnd(value, style) {
var msGridRow = style.msGridRow;
if (isSimplePositionValue(value) && isSimplePositionValue(msGridRow)) {
style.msGridRowSpan = value - msGridRow;
}
},
gridRowStart: function gridRowStart(value, style) {
if (isSimplePositionValue(value)) {
style.msGridRow = value;
}
},
gridTemplateColumns: function gridTemplateColumns(value, style) {
style.msGridColumns = value;
},
gridTemplateRows: function gridTemplateRows(value, style) {
style.msGridRows = value;
},
justifySelf: function justifySelf(value, style) {
if (alignmentValues.indexOf(value) > -1) {
style.msGridColumnAlign = value;
}
}
};
export default function grid(property, value, style) {
if (property === 'display' && value in displayValues) {
return displayValues[value];
}
if (property in propertyConverters) {
var propertyConverter = propertyConverters[property];
propertyConverter(value, style);
}
}
@@ -0,0 +1,12 @@
import isPrefixedValue from 'css-in-js-utils/lib/isPrefixedValue';
// http://caniuse.com/#feat=css-image-set
var prefixes = ['-webkit-', ''];
export default function imageSet(property, value) {
if (typeof value === 'string' && !isPrefixedValue(value) && value.indexOf('image-set(') > -1) {
return prefixes.map(function (prefix) {
return value.replace(/image-set\(/g, prefix + 'image-set(');
});
}
}
+16
View File
@@ -0,0 +1,16 @@
import calc from './calc';
import cursor from './cursor';
import crossFade from './crossFade';
import filter from './filter';
import flex from './flex';
import flexboxIE from './flexboxIE';
import flexboxOld from './flexboxOld';
import gradient from './gradient';
import grid from './grid';
import imageSet from './imageSet';
import logical from './logical';
import position from './position';
import sizing from './sizing';
import transition from './transition';
export default [calc, crossFade, cursor, filter, flex, flexboxIE, flexboxOld, gradient, grid, imageSet, logical, position, sizing, transition];
@@ -0,0 +1,35 @@
var alternativeProps = {
marginBlockStart: ['WebkitMarginBefore'],
marginBlockEnd: ['WebkitMarginAfter'],
marginInlineStart: ['WebkitMarginStart', 'MozMarginStart'],
marginInlineEnd: ['WebkitMarginEnd', 'MozMarginEnd'],
paddingBlockStart: ['WebkitPaddingBefore'],
paddingBlockEnd: ['WebkitPaddingAfter'],
paddingInlineStart: ['WebkitPaddingStart', 'MozPaddingStart'],
paddingInlineEnd: ['WebkitPaddingEnd', 'MozPaddingEnd'],
borderBlockStart: ['WebkitBorderBefore'],
borderBlockStartColor: ['WebkitBorderBeforeColor'],
borderBlockStartStyle: ['WebkitBorderBeforeStyle'],
borderBlockStartWidth: ['WebkitBorderBeforeWidth'],
borderBlockEnd: ['WebkitBorderAfter'],
borderBlockEndColor: ['WebkitBorderAfterColor'],
borderBlockEndStyle: ['WebkitBorderAfterStyle'],
borderBlockEndWidth: ['WebkitBorderAfterWidth'],
borderInlineStart: ['WebkitBorderStart', 'MozBorderStart'],
borderInlineStartColor: ['WebkitBorderStartColor', 'MozBorderStartColor'],
borderInlineStartStyle: ['WebkitBorderStartStyle', 'MozBorderStartStyle'],
borderInlineStartWidth: ['WebkitBorderStartWidth', 'MozBorderStartWidth'],
borderInlineEnd: ['WebkitBorderEnd', 'MozBorderEnd'],
borderInlineEndColor: ['WebkitBorderEndColor', 'MozBorderEndColor'],
borderInlineEndStyle: ['WebkitBorderEndStyle', 'MozBorderEndStyle'],
borderInlineEndWidth: ['WebkitBorderEndWidth', 'MozBorderEndWidth']
};
export default function logical(property, value, style) {
if (Object.prototype.hasOwnProperty.call(alternativeProps, property)) {
var alternativePropList = alternativeProps[property];
for (var i = 0, len = alternativePropList.length; i < len; ++i) {
style[alternativePropList[i]] = value;
}
}
}
@@ -0,0 +1,5 @@
export default function position(property, value) {
if (property === 'position' && value === 'sticky') {
return ['-webkit-sticky', 'sticky'];
}
}
+26
View File
@@ -0,0 +1,26 @@
var prefixes = ['-webkit-', '-moz-', ''];
var properties = {
maxHeight: true,
maxWidth: true,
width: true,
height: true,
columnWidth: true,
minWidth: true,
minHeight: true
};
var values = {
'min-content': true,
'max-content': true,
'fill-available': true,
'fit-content': true,
'contain-floats': true
};
export default function sizing(property, value) {
if (properties.hasOwnProperty(property) && values.hasOwnProperty(value)) {
return prefixes.map(function (prefix) {
return prefix + value;
});
}
}
@@ -0,0 +1,75 @@
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;
}
}
@@ -0,0 +1,15 @@
function addIfNew(list, value) {
if (list.indexOf(value) === -1) {
list.push(value);
}
}
export default function addNewValuesOnly(list, values) {
if (Array.isArray(values)) {
for (var i = 0, len = values.length; i < len; ++i) {
addIfNew(list, values[i]);
}
} else {
addIfNew(list, values);
}
}
@@ -0,0 +1,3 @@
export default function capitalizeString(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
@@ -0,0 +1,3 @@
export default function isObject(value) {
return value instanceof Object && !Array.isArray(value);
}
@@ -0,0 +1,19 @@
import capitalizeString from './capitalizeString';
export default function prefixProperty(prefixProperties, property, style) {
var requiredPrefixes = prefixProperties[property];
if (requiredPrefixes && style.hasOwnProperty(property)) {
var capitalizedProperty = capitalizeString(property);
for (var i = 0; i < requiredPrefixes.length; ++i) {
var prefixedProperty = requiredPrefixes[i] + capitalizedProperty;
if (!style[prefixedProperty]) {
style[prefixedProperty] = style[property];
}
}
}
return style;
}
@@ -0,0 +1,11 @@
export default function prefixValue(plugins, property, value, style, metaData) {
for (var i = 0, len = plugins.length; i < len; ++i) {
var processedValue = plugins[i](property, value, style, metaData);
// we can stop processing if a value is returned
// as all plugin criteria are unique
if (processedValue) {
return processedValue;
}
}
}
@@ -0,0 +1,67 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = createPrefixer;
var _prefixProperty = require('./utils/prefixProperty');
var _prefixProperty2 = _interopRequireDefault(_prefixProperty);
var _prefixValue = require('./utils/prefixValue');
var _prefixValue2 = _interopRequireDefault(_prefixValue);
var _addNewValuesOnly = require('./utils/addNewValuesOnly');
var _addNewValuesOnly2 = _interopRequireDefault(_addNewValuesOnly);
var _isObject = require('./utils/isObject');
var _isObject2 = _interopRequireDefault(_isObject);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function createPrefixer(_ref) {
var prefixMap = _ref.prefixMap,
plugins = _ref.plugins;
return function prefix(style) {
for (var property in style) {
var value = style[property];
// handle nested objects
if ((0, _isObject2.default)(value)) {
style[property] = prefix(value);
// handle array values
} else if (Array.isArray(value)) {
var combinedValue = [];
for (var i = 0, len = value.length; i < len; ++i) {
var processedValue = (0, _prefixValue2.default)(plugins, property, value[i], style, prefixMap);
(0, _addNewValuesOnly2.default)(combinedValue, processedValue || value[i]);
}
// only modify the value if it was touched
// by any plugin to prevent unnecessary mutations
if (combinedValue.length > 0) {
style[property] = combinedValue;
}
} else {
var _processedValue = (0, _prefixValue2.default)(plugins, property, value, style, prefixMap);
// only modify the value if it was touched
// by any plugin to prevent unnecessary mutations
if (_processedValue) {
style[property] = _processedValue;
}
style = (0, _prefixProperty2.default)(prefixMap, property, style);
}
}
return style;
};
}
+71
View File
@@ -0,0 +1,71 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _crossFade = require('inline-style-prefixer/lib/plugins/crossFade');
var _crossFade2 = _interopRequireDefault(_crossFade);
var _imageSet = require('inline-style-prefixer/lib/plugins/imageSet');
var _imageSet2 = _interopRequireDefault(_imageSet);
var _sizing = require('inline-style-prefixer/lib/plugins/sizing');
var _sizing2 = _interopRequireDefault(_sizing);
var _transition = require('inline-style-prefixer/lib/plugins/transition');
var _transition2 = _interopRequireDefault(_transition);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var w = ['Webkit'];
var m = ['Moz'];
var ms = ['ms'];
var wm = ['Webkit', 'Moz'];
var wms = ['Webkit', 'ms'];
var wmms = ['Webkit', 'Moz', 'ms'];
exports.default = {
plugins: [_crossFade2.default, _imageSet2.default, _sizing2.default, _transition2.default],
prefixMap: {
textEmphasisPosition: w,
textEmphasis: w,
textEmphasisStyle: w,
textEmphasisColor: w,
boxDecorationBreak: w,
maskImage: w,
maskMode: w,
maskRepeat: w,
maskPosition: w,
maskClip: w,
maskOrigin: w,
maskSize: w,
maskComposite: w,
mask: w,
maskBorderSource: w,
maskBorderMode: w,
maskBorderSlice: w,
maskBorderWidth: w,
maskBorderOutset: w,
maskBorderRepeat: w,
maskBorder: w,
maskType: w,
appearance: w,
userSelect: w,
backdropFilter: w,
clipPath: w,
hyphens: w,
textOrientation: w,
tabSize: m,
fontKerning: w,
textSizeAdjust: w,
textDecorationStyle: w,
textDecorationSkip: w,
textDecorationLine: w,
textDecorationColor: w
}
};
@@ -0,0 +1,32 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = getRecommendedPlugins;
var _pluginMap = require('./maps/pluginMap');
var _pluginMap2 = _interopRequireDefault(_pluginMap);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function getRecommendedPlugins(browserList) {
var recommendedPlugins = {};
for (var plugin in _pluginMap2.default) {
var browserSupportByPlugin = _pluginMap2.default[plugin];
for (var browser in browserSupportByPlugin) {
if (browserList.hasOwnProperty(browser)) {
var browserVersion = browserSupportByPlugin[browser];
if (browserList[browser] < browserVersion) {
recommendedPlugins[plugin] = true;
}
}
}
}
return Object.keys(recommendedPlugins);
}
@@ -0,0 +1,89 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = generatePrefixMap;
var _caniuseApi = require('caniuse-api');
var _propertyMap = require('./maps/propertyMap');
var _propertyMap2 = _interopRequireDefault(_propertyMap);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var 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'
// remove flexprops from IE
};var flexPropsIE = ['alignContent', 'alignSelf', 'alignItems', 'justifyContent', 'order', 'flexGrow', 'flexShrink', 'flexBasis'];
function filterAndRemoveIfEmpty(map, property, filter) {
if (map[property]) {
map[property] = map[property].filter(filter);
if (map[property].length === 0) {
delete map[property];
}
}
}
function generatePrefixMap(browserList) {
var prefixMap = {};
for (var browser in prefixBrowserMap) {
var prefix = prefixBrowserMap[browser];
for (var keyword in _propertyMap2.default) {
var keywordProperties = [].concat(_propertyMap2.default[keyword]);
var versions = (0, _caniuseApi.getSupport)(keyword);
for (var i = 0, len = keywordProperties.length; i < len; ++i) {
if (versions[browser]) {
if (versions[browser].x >= browserList[browser]) {
var property = keywordProperties[i];
if (!prefixMap[property]) {
prefixMap[property] = [];
}
if (prefixMap[property].indexOf(prefix) === -1) {
prefixMap[property].push(prefix);
}
}
}
}
}
}
// remove flexProps from IE and Firefox due to alternative syntax
for (var _i = 0, _len = flexPropsIE.length; _i < _len; ++_i) {
filterAndRemoveIfEmpty(prefixMap, flexPropsIE[_i], function (prefix) {
return prefix !== 'ms' && prefix !== 'Moz';
});
}
// remove transition from Moz and Webkit as they are handled
// specially by the transition plugins
filterAndRemoveIfEmpty(prefixMap, 'transition', function (prefix) {
return prefix !== 'Moz' && prefix !== 'Webkit';
});
// remove WebkitFlexDirection as it does not exist
filterAndRemoveIfEmpty(prefixMap, 'flexDirection', function (prefix) {
return prefix !== 'Moz';
});
return prefixMap;
}
@@ -0,0 +1,85 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
exports.generateFile = generateFile;
exports.default = generateData;
var _generatePrefixMap = require('./generatePrefixMap');
var _generatePrefixMap2 = _interopRequireDefault(_generatePrefixMap);
var _generatePluginList = require('./generatePluginList');
var _generatePluginList2 = _interopRequireDefault(_generatePluginList);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function generateImportString(plugin, compatibility) {
if (compatibility) {
return 'var ' + plugin + ' = require(\'inline-style-prefixer/lib/plugins/' + plugin + '\')';
}
return 'import ' + plugin + ' from \'inline-style-prefixer/lib/plugins/' + plugin + '\'';
}
function generateFile(prefixMap, pluginList, compatibility) {
var pluginImports = pluginList.map(function (plugin) {
return generateImportString(plugin, compatibility);
}).join('\n');
var moduleExporter = compatibility ? 'module.exports = ' : 'export default';
var pluginExport = '[' + pluginList.join(',') + ']';
var prefixMapExport = JSON.stringify(prefixMap);
var prefixVariables = ['var w = ["Webkit"];', 'var m = ["Moz"];', 'var ms = ["ms"];', 'var wm = ["Webkit","Moz"];', 'var wms = ["Webkit","ms"];', 'var wmms = ["Webkit","Moz","ms"];'].join('\n');
return pluginImports + '\n' + prefixVariables + '\n\n' + moduleExporter + ' {\n plugins: ' + pluginExport + ',\n prefixMap: ' + prefixMapExport.replace(/\["Webkit"\]/g, 'w').replace(/\["Moz"\]/g, 'm').replace(/\["ms"\]/g, 'ms').replace(/\["Webkit","Moz"\]/g, 'wm').replace(/\["Webkit","ms"\]/g, 'wms').replace(/\["Webkit","Moz","ms"\]/g, 'wmms') + '\n}';
}
function saveFile(fileContent, path) {
/* eslint-disable global-require */
var fs = require('fs');
/* eslint-enable global-require */
fs.writeFile(path, fileContent, function (err) {
if (err) {
throw err;
}
console.log('Successfully saved data to "' + path + '".');
});
}
var defaultOptions = {
prefixMap: true,
plugins: true,
compatibility: false
};
function generateData(browserList) {
var userOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = _extends({}, defaultOptions, userOptions);
var compatibility = options.compatibility,
plugins = options.plugins,
path = options.path,
prefixMap = options.prefixMap;
var requiredPrefixMap = prefixMap ? (0, _generatePrefixMap2.default)(browserList) : {};
var requiredPlugins = plugins ? (0, _generatePluginList2.default)(browserList) : [];
if (path) {
saveFile(generateFile(requiredPrefixMap, requiredPlugins, compatibility), path);
}
return {
prefixMap: requiredPrefixMap,
plugins: requiredPlugins
};
}
@@ -0,0 +1,100 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// values are "up-to"
var maximumVersion = 9999;
exports.default = {
calc: {
firefox: 15,
chrome: 25,
safari: 6.1,
ios_saf: 7
},
crossFade: {
chrome: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
ios_saf: 10,
safari: 10
},
cursor: {
firefox: 24,
chrome: 37,
safari: 9,
opera: 24
},
filter: {
ios_saf: 9.3,
safari: 9.1
},
flex: {
chrome: 29,
safari: 9,
ios_saf: 9,
opera: 16
},
flexboxIE: {
ie: 11
},
flexboxOld: {
firefox: 22,
chrome: 21,
safari: 6.2,
ios_saf: 6.2,
android: 4.4
},
gradient: {
firefox: 16,
chrome: 26,
safari: 7,
ios_saf: 7,
opera: 12.1,
op_mini: 12.1,
android: 4.4
},
grid: {
edge: 16,
ie: 11
},
imageSet: {
chrome: maximumVersion,
safari: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
ios_saf: maximumVersion
},
logical: {
chrome: 68,
safari: 12,
opera: 55,
and_chr: 66,
ios_saf: 12,
firefox: 40
},
position: {
safari: 12.1,
ios_saf: 12.4
},
sizing: {
chrome: 46,
safari: 10.1,
opera: 33,
and_chr: 53,
ios_saf: maximumVersion
},
transition: {
chrome: maximumVersion,
safari: maximumVersion,
opera: maximumVersion,
and_chr: maximumVersion,
and_uc: maximumVersion,
ios_saf: maximumVersion,
msie: maximumVersion,
edge: maximumVersion,
firefox: maximumVersion,
op_mini: maximumVersion
}
};
@@ -0,0 +1,43 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
'border-radius': 'borderRadius',
'border-image': ['borderImage', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'],
flexbox: ['flex', 'flexBasis', 'flexDirection', 'flexGrow', 'flexFlow', 'flexShrink', 'flexWrap', 'alignContent', 'alignItems', 'alignSelf', 'justifyContent', 'order'],
'css-transitions': ['transition', 'transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'],
transforms2d: ['transform', 'transformOrigin', 'transformOriginX', 'transformOriginY'],
transforms3d: ['backfaceVisibility', 'perspective', 'perspectiveOrigin', 'transform', 'transformOrigin', 'transformStyle', 'transformOriginX', 'transformOriginY', 'transformOriginZ'],
'css-animation': ['animation', 'animationDelay', 'animationDirection', 'animationFillMode', 'animationDuration', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'],
'css-appearance': 'appearance',
'user-select-none': 'userSelect',
'css-backdrop-filter': 'backdropFilter',
'css3-boxsizing': 'boxSizing',
'font-kerning': 'fontKerning',
'css-exclusions': ['wrapFlow', 'wrapThrough', 'wrapMargin'],
'css-snappoints': ['scrollSnapType', 'scrollSnapPointsX', 'scrollSnapPointsY', 'scrollSnapDestination', 'scrollSnapCoordinate'],
'text-emphasis': ['textEmphasisPosition', 'textEmphasis', 'textEmphasisStyle', 'textEmphasisColor'],
'css-text-align-last': 'textAlignLast',
'css-boxdecorationbreak': 'boxDecorationBreak',
'css-clip-path': 'clipPath',
'css-masks': ['maskImage', 'maskMode', 'maskRepeat', 'maskPosition', 'maskClip', 'maskOrigin', 'maskSize', 'maskComposite', 'mask', 'maskBorderSource', 'maskBorderMode', 'maskBorderSlice', 'maskBorderWidth', 'maskBorderOutset', 'maskBorderRepeat', 'maskBorder', 'maskType'],
'css-touch-action': 'touchAction',
'text-size-adjust': 'textSizeAdjust',
'text-decoration': ['textDecorationStyle', 'textDecorationSkip', 'textDecorationLine', 'textDecorationColor'],
'css-shapes': ['shapeImageThreshold', 'shapeImageMargin', 'shapeImageOutside'],
'css3-tabsize': 'tabSize',
'css-filters': 'filter',
'css-resize': 'resize',
'css-hyphens': 'hyphens',
'css-regions': ['flowInto', 'flowFrom', 'breakBefore', 'breakAfter', 'breakInside', 'regionFragment'],
'object-fit': ['objectFit', 'objectPosition'],
'text-overflow': 'textOverflow',
'background-img-opts': ['backgroundClip', 'backgroundOrigin', 'backgroundSize'],
'font-feature': 'fontFeatureSettings',
'css-boxshadow': 'boxShadow',
multicolumn: ['breakAfter', 'breakBefore', 'breakInside', 'columnCount', 'columnFill', 'columnGap', 'columnRule', 'columnRuleColor', 'columnRuleStyle', 'columnRuleWidth', 'columns', 'columnSpan', 'columnWidth', 'columnGap'],
'css-writing-mode': ['writingMode'],
'css-text-orientation': ['textOrientation']
};
+74
View File
@@ -0,0 +1,74 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.prefix = exports.createPrefixer = undefined;
var _createPrefixer = require('./createPrefixer');
var _createPrefixer2 = _interopRequireDefault(_createPrefixer);
var _data = require('./data');
var _data2 = _interopRequireDefault(_data);
var _cursor = require('./plugins/cursor');
var _cursor2 = _interopRequireDefault(_cursor);
var _crossFade = require('./plugins/crossFade');
var _crossFade2 = _interopRequireDefault(_crossFade);
var _filter = require('./plugins/filter');
var _filter2 = _interopRequireDefault(_filter);
var _flex = require('./plugins/flex');
var _flex2 = _interopRequireDefault(_flex);
var _flexboxOld = require('./plugins/flexboxOld');
var _flexboxOld2 = _interopRequireDefault(_flexboxOld);
var _gradient = require('./plugins/gradient');
var _gradient2 = _interopRequireDefault(_gradient);
var _grid = require('./plugins/grid');
var _grid2 = _interopRequireDefault(_grid);
var _imageSet = require('./plugins/imageSet');
var _imageSet2 = _interopRequireDefault(_imageSet);
var _logical = require('./plugins/logical');
var _logical2 = _interopRequireDefault(_logical);
var _position = require('./plugins/position');
var _position2 = _interopRequireDefault(_position);
var _sizing = require('./plugins/sizing');
var _sizing2 = _interopRequireDefault(_sizing);
var _transition = require('./plugins/transition');
var _transition2 = _interopRequireDefault(_transition);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var plugins = [_crossFade2.default, _cursor2.default, _filter2.default, _flexboxOld2.default, _gradient2.default, _grid2.default, _imageSet2.default, _logical2.default, _position2.default, _sizing2.default, _transition2.default, _flex2.default];
var prefix = (0, _createPrefixer2.default)({
prefixMap: _data2.default.prefixMap,
plugins: plugins
});
exports.createPrefixer = _createPrefixer2.default;
exports.prefix = prefix;
+19
View File
@@ -0,0 +1,19 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = calc;
var _cssInJsUtils = require('css-in-js-utils');
var CALC_REGEX = /calc\(/g;
var prefixes = ['-webkit-', '-moz-', ''];
function calc(property, value) {
if (typeof value === 'string' && !(0, _cssInJsUtils.isPrefixedValue)(value) && value.indexOf('calc(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(CALC_REGEX, prefix + 'calc(');
});
}
}
@@ -0,0 +1,20 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = crossFade;
var _cssInJsUtils = require('css-in-js-utils');
var CROSS_FADE_REGEX = /cross-fade\(/g;
// http://caniuse.com/#search=cross-fade
var prefixes = ['-webkit-', ''];
function crossFade(property, value) {
if (typeof value === 'string' && !(0, _cssInJsUtils.isPrefixedValue)(value) && value.indexOf('cross-fade(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(CROSS_FADE_REGEX, prefix + 'cross-fade(');
});
}
}
@@ -0,0 +1,22 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = cursor;
var prefixes = ['-webkit-', '-moz-', ''];
var values = {
'zoom-in': true,
'zoom-out': true,
grab: true,
grabbing: true
};
function cursor(property, value) {
if (property === 'cursor' && values.hasOwnProperty(value)) {
return prefixes.map(function (prefix) {
return prefix + value;
});
}
}
@@ -0,0 +1,20 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = filter;
var _cssInJsUtils = require('css-in-js-utils');
var FILTER_REGEX = /filter\(/g;
// http://caniuse.com/#feat=css-filter-function
var prefixes = ['-webkit-', ''];
function filter(property, value) {
if (typeof value === 'string' && !(0, _cssInJsUtils.isPrefixedValue)(value) && value.indexOf('filter(') !== -1) {
return prefixes.map(function (prefix) {
return value.replace(FILTER_REGEX, prefix + 'filter(');
});
}
}
+16
View File
@@ -0,0 +1,16 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = flex;
var values = {
flex: ['-webkit-box', '-moz-box', '-ms-flexbox', '-webkit-flex', 'flex'],
'inline-flex': ['-webkit-inline-box', '-moz-inline-box', '-ms-inline-flexbox', '-webkit-inline-flex', 'inline-flex']
};
function flex(property, value) {
if (property === 'display' && values.hasOwnProperty(value)) {
return values[value];
}
}
@@ -0,0 +1,88 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = flexboxIE;
var alternativeValues = {
'space-around': 'distribute',
'space-between': 'justify',
'flex-start': 'start',
'flex-end': 'end'
};
var alternativeProps = {
alignContent: 'msFlexLinePack',
alignSelf: 'msFlexItemAlign',
alignItems: 'msFlexAlign',
justifyContent: 'msFlexPack',
order: 'msFlexOrder',
flexGrow: 'msFlexPositive',
flexShrink: 'msFlexNegative',
flexBasis: 'msFlexPreferredSize'
// Full expanded syntax is flex-grow | flex-shrink | flex-basis.
};var flexShorthandMappings = {
auto: '1 1 auto',
inherit: 'inherit',
initial: '0 1 auto',
none: '0 0 auto',
unset: 'unset'
};
var isUnitlessNumber = /^\d+(\.\d+)?$/;
var logTag = 'inline-style-prefixer.flexboxIE plugin';
function flexboxIE(property, value, style) {
if (alternativeProps.hasOwnProperty(property)) {
style[alternativeProps[property]] = alternativeValues[value] || value;
}
if (property === 'flex') {
// For certain values we can do straight mappings based on the spec
// for the expansions.
if (Object.prototype.hasOwnProperty.call(flexShorthandMappings, value)) {
style.msFlex = flexShorthandMappings[value];
return;
}
// Here we have no direct mapping, so we favor looking for a
// unitless positive number as that will be the most common use-case.
if (isUnitlessNumber.test(value)) {
style.msFlex = value + ' 1 0%';
return;
}
if (typeof value === 'number' && value < 0) {
// ignore negative values;
console.warn(logTag + ': "flex: ' + value + '", negative values are not valid and will be ignored.');
return;
}
if (!value.split) {
console.warn(logTag + ': "flex: ' + value + '", value format are not detected, it will be remain as is');
style.msFlex = value;
return;
}
// The next thing we can look for is if there are multiple values.
var flexValues = value.split(/\s/);
// If we only have a single value that wasn't a positive unitless
// or a pre-mapped value, then we can assume it is a unit value.
switch (flexValues.length) {
case 1:
style.msFlex = '1 1 ' + value;
return;
case 2:
// If we have 2 units, then we expect that the first will
// always be a unitless number and represents flex-grow.
// The second unit will represent flex-shrink for a unitless
// value, or flex-basis otherwise.
if (isUnitlessNumber.test(flexValues[1])) {
style.msFlex = flexValues[0] + ' ' + flexValues[1] + ' 0%';
} else {
style.msFlex = flexValues[0] + ' 1 ' + flexValues[1];
}
return;
default:
style.msFlex = value;
}
}
}
@@ -0,0 +1,39 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = flexboxOld;
var alternativeValues = {
'space-around': 'justify',
'space-between': 'justify',
'flex-start': 'start',
'flex-end': 'end',
'wrap-reverse': 'multiple',
wrap: 'multiple'
};
var alternativeProps = {
alignItems: 'WebkitBoxAlign',
justifyContent: 'WebkitBoxPack',
flexWrap: 'WebkitBoxLines',
flexGrow: 'WebkitBoxFlex'
};
function flexboxOld(property, value, style) {
if (property === 'flexDirection' && typeof value === 'string') {
if (value.indexOf('column') > -1) {
style.WebkitBoxOrient = 'vertical';
} else {
style.WebkitBoxOrient = 'horizontal';
}
if (value.indexOf('reverse') > -1) {
style.WebkitBoxDirection = 'reverse';
} else {
style.WebkitBoxDirection = 'normal';
}
}
if (alternativeProps.hasOwnProperty(property)) {
style[alternativeProps[property]] = alternativeValues[value] || value;
}
}
@@ -0,0 +1,25 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = gradient;
var _isPrefixedValue = require('css-in-js-utils/lib/isPrefixedValue');
var _isPrefixedValue2 = _interopRequireDefault(_isPrefixedValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var prefixes = ['-webkit-', '-moz-', ''];
var values = /linear-gradient|radial-gradient|repeating-linear-gradient|repeating-radial-gradient/gi;
function gradient(property, value) {
if (typeof value === 'string' && !(0, _isPrefixedValue2.default)(value) && values.test(value)) {
return prefixes.map(function (prefix) {
return value.replace(values, function (grad) {
return prefix + grad;
});
});
}
}
+136
View File
@@ -0,0 +1,136 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
exports.default = grid;
function isSimplePositionValue(value) {
return typeof value === 'number' && !isNaN(value);
}
function isComplexSpanValue(value) {
return typeof value === 'string' && value.includes('/');
}
var alignmentValues = ['center', 'end', 'start', 'stretch'];
var displayValues = {
'inline-grid': ['-ms-inline-grid', 'inline-grid'],
grid: ['-ms-grid', 'grid']
};
var propertyConverters = {
alignSelf: function alignSelf(value, style) {
if (alignmentValues.indexOf(value) > -1) {
style.msGridRowAlign = value;
}
},
gridColumn: function gridColumn(value, style) {
if (isSimplePositionValue(value)) {
style.msGridColumn = value;
} else if (isComplexSpanValue(value)) {
var _value$split = value.split('/'),
_value$split2 = _slicedToArray(_value$split, 2),
start = _value$split2[0],
end = _value$split2[1];
propertyConverters.gridColumnStart(+start, style);
var _end$split = end.split(/ ?span /),
_end$split2 = _slicedToArray(_end$split, 2),
maybeSpan = _end$split2[0],
maybeNumber = _end$split2[1];
if (maybeSpan === '') {
propertyConverters.gridColumnEnd(+start + +maybeNumber, style);
} else {
propertyConverters.gridColumnEnd(+end, style);
}
} else {
propertyConverters.gridColumnStart(value, style);
}
},
gridColumnEnd: function gridColumnEnd(value, style) {
var msGridColumn = style.msGridColumn;
if (isSimplePositionValue(value) && isSimplePositionValue(msGridColumn)) {
style.msGridColumnSpan = value - msGridColumn;
}
},
gridColumnStart: function gridColumnStart(value, style) {
if (isSimplePositionValue(value)) {
style.msGridColumn = value;
}
},
gridRow: function gridRow(value, style) {
if (isSimplePositionValue(value)) {
style.msGridRow = value;
} else if (isComplexSpanValue(value)) {
var _value$split3 = value.split('/'),
_value$split4 = _slicedToArray(_value$split3, 2),
start = _value$split4[0],
end = _value$split4[1];
propertyConverters.gridRowStart(+start, style);
var _end$split3 = end.split(/ ?span /),
_end$split4 = _slicedToArray(_end$split3, 2),
maybeSpan = _end$split4[0],
maybeNumber = _end$split4[1];
if (maybeSpan === '') {
propertyConverters.gridRowEnd(+start + +maybeNumber, style);
} else {
propertyConverters.gridRowEnd(+end, style);
}
} else {
propertyConverters.gridRowStart(value, style);
}
},
gridRowEnd: function gridRowEnd(value, style) {
var msGridRow = style.msGridRow;
if (isSimplePositionValue(value) && isSimplePositionValue(msGridRow)) {
style.msGridRowSpan = value - msGridRow;
}
},
gridRowStart: function gridRowStart(value, style) {
if (isSimplePositionValue(value)) {
style.msGridRow = value;
}
},
gridTemplateColumns: function gridTemplateColumns(value, style) {
style.msGridColumns = value;
},
gridTemplateRows: function gridTemplateRows(value, style) {
style.msGridRows = value;
},
justifySelf: function justifySelf(value, style) {
if (alignmentValues.indexOf(value) > -1) {
style.msGridColumnAlign = value;
}
}
};
function grid(property, value, style) {
if (property === 'display' && value in displayValues) {
return displayValues[value];
}
if (property in propertyConverters) {
var propertyConverter = propertyConverters[property];
propertyConverter(value, style);
}
}
@@ -0,0 +1,23 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = imageSet;
var _isPrefixedValue = require('css-in-js-utils/lib/isPrefixedValue');
var _isPrefixedValue2 = _interopRequireDefault(_isPrefixedValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
// http://caniuse.com/#feat=css-image-set
var prefixes = ['-webkit-', ''];
function imageSet(property, value) {
if (typeof value === 'string' && !(0, _isPrefixedValue2.default)(value) && value.indexOf('image-set(') > -1) {
return prefixes.map(function (prefix) {
return value.replace(/image-set\(/g, prefix + 'image-set(');
});
}
}
+65
View File
@@ -0,0 +1,65 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _calc = require('./calc');
var _calc2 = _interopRequireDefault(_calc);
var _cursor = require('./cursor');
var _cursor2 = _interopRequireDefault(_cursor);
var _crossFade = require('./crossFade');
var _crossFade2 = _interopRequireDefault(_crossFade);
var _filter = require('./filter');
var _filter2 = _interopRequireDefault(_filter);
var _flex = require('./flex');
var _flex2 = _interopRequireDefault(_flex);
var _flexboxIE = require('./flexboxIE');
var _flexboxIE2 = _interopRequireDefault(_flexboxIE);
var _flexboxOld = require('./flexboxOld');
var _flexboxOld2 = _interopRequireDefault(_flexboxOld);
var _gradient = require('./gradient');
var _gradient2 = _interopRequireDefault(_gradient);
var _grid = require('./grid');
var _grid2 = _interopRequireDefault(_grid);
var _imageSet = require('./imageSet');
var _imageSet2 = _interopRequireDefault(_imageSet);
var _logical = require('./logical');
var _logical2 = _interopRequireDefault(_logical);
var _position = require('./position');
var _position2 = _interopRequireDefault(_position);
var _sizing = require('./sizing');
var _sizing2 = _interopRequireDefault(_sizing);
var _transition = require('./transition');
var _transition2 = _interopRequireDefault(_transition);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = [_calc2.default, _crossFade2.default, _cursor2.default, _filter2.default, _flex2.default, _flexboxIE2.default, _flexboxOld2.default, _gradient2.default, _grid2.default, _imageSet2.default, _logical2.default, _position2.default, _sizing2.default, _transition2.default];
@@ -0,0 +1,41 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = logical;
var alternativeProps = {
marginBlockStart: ['WebkitMarginBefore'],
marginBlockEnd: ['WebkitMarginAfter'],
marginInlineStart: ['WebkitMarginStart', 'MozMarginStart'],
marginInlineEnd: ['WebkitMarginEnd', 'MozMarginEnd'],
paddingBlockStart: ['WebkitPaddingBefore'],
paddingBlockEnd: ['WebkitPaddingAfter'],
paddingInlineStart: ['WebkitPaddingStart', 'MozPaddingStart'],
paddingInlineEnd: ['WebkitPaddingEnd', 'MozPaddingEnd'],
borderBlockStart: ['WebkitBorderBefore'],
borderBlockStartColor: ['WebkitBorderBeforeColor'],
borderBlockStartStyle: ['WebkitBorderBeforeStyle'],
borderBlockStartWidth: ['WebkitBorderBeforeWidth'],
borderBlockEnd: ['WebkitBorderAfter'],
borderBlockEndColor: ['WebkitBorderAfterColor'],
borderBlockEndStyle: ['WebkitBorderAfterStyle'],
borderBlockEndWidth: ['WebkitBorderAfterWidth'],
borderInlineStart: ['WebkitBorderStart', 'MozBorderStart'],
borderInlineStartColor: ['WebkitBorderStartColor', 'MozBorderStartColor'],
borderInlineStartStyle: ['WebkitBorderStartStyle', 'MozBorderStartStyle'],
borderInlineStartWidth: ['WebkitBorderStartWidth', 'MozBorderStartWidth'],
borderInlineEnd: ['WebkitBorderEnd', 'MozBorderEnd'],
borderInlineEndColor: ['WebkitBorderEndColor', 'MozBorderEndColor'],
borderInlineEndStyle: ['WebkitBorderEndStyle', 'MozBorderEndStyle'],
borderInlineEndWidth: ['WebkitBorderEndWidth', 'MozBorderEndWidth']
};
function logical(property, value, style) {
if (Object.prototype.hasOwnProperty.call(alternativeProps, property)) {
var alternativePropList = alternativeProps[property];
for (var i = 0, len = alternativePropList.length; i < len; ++i) {
style[alternativePropList[i]] = value;
}
}
}
@@ -0,0 +1,11 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = position;
function position(property, value) {
if (property === 'position' && value === 'sticky') {
return ['-webkit-sticky', 'sticky'];
}
}
@@ -0,0 +1,32 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = sizing;
var prefixes = ['-webkit-', '-moz-', ''];
var properties = {
maxHeight: true,
maxWidth: true,
width: true,
height: true,
columnWidth: true,
minWidth: true,
minHeight: true
};
var values = {
'min-content': true,
'max-content': true,
'fill-available': true,
'fit-content': true,
'contain-floats': true
};
function sizing(property, value) {
if (properties.hasOwnProperty(property) && values.hasOwnProperty(value)) {
return prefixes.map(function (prefix) {
return prefix + value;
});
}
}
@@ -0,0 +1,91 @@
'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;
}
}
@@ -0,0 +1,21 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = addNewValuesOnly;
function addIfNew(list, value) {
if (list.indexOf(value) === -1) {
list.push(value);
}
}
function addNewValuesOnly(list, values) {
if (Array.isArray(values)) {
for (var i = 0, len = values.length; i < len; ++i) {
addIfNew(list, values[i]);
}
} else {
addIfNew(list, values);
}
}
@@ -0,0 +1,9 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = capitalizeString;
function capitalizeString(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
@@ -0,0 +1,9 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isObject;
function isObject(value) {
return value instanceof Object && !Array.isArray(value);
}
@@ -0,0 +1,30 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = prefixProperty;
var _capitalizeString = require('./capitalizeString');
var _capitalizeString2 = _interopRequireDefault(_capitalizeString);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function prefixProperty(prefixProperties, property, style) {
var requiredPrefixes = prefixProperties[property];
if (requiredPrefixes && style.hasOwnProperty(property)) {
var capitalizedProperty = (0, _capitalizeString2.default)(property);
for (var i = 0; i < requiredPrefixes.length; ++i) {
var prefixedProperty = requiredPrefixes[i] + capitalizedProperty;
if (!style[prefixedProperty]) {
style[prefixedProperty] = style[property];
}
}
}
return style;
}
@@ -0,0 +1,17 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = prefixValue;
function prefixValue(plugins, property, value, style, metaData) {
for (var i = 0, len = plugins.length; i < len; ++i) {
var processedValue = plugins[i](property, value, style, metaData);
// we can stop processing if a value is returned
// as all plugin criteria are unique
if (processedValue) {
return processedValue;
}
}
}
+77
View File
@@ -0,0 +1,77 @@
{
"name": "inline-style-prefixer",
"version": "7.0.1",
"description": "Run-time Autoprefixer for JavaScript style objects",
"module": "es/index.js",
"jsnext:main": "es/index.js",
"main": "lib/index.js",
"files": [
"LICENSE",
"README.md",
"lib/",
"es/"
],
"scripts": {
"babel:es": "babel -d es modules --ignore __tests__",
"babel:lib": "cross-env BABEL_ENV=commonjs babel -d lib modules --ignore __tests__",
"babel": "yarn babel:es && yarn babel:lib",
"build": "yarn run check && yarn generate && yarn babel",
"check": "yarn clear && yarn format && yarn lint && yarn coverage",
"clear": "rimraf lib es coverage _book",
"docs": "gitbook install && gitbook build && gh-pages -d _book",
"flow": "flow",
"format": "prettier --write \"./modules/**/*.js\"",
"generate": "cross-env BABEL_ENV=commonjs babel-node generateDefaultData",
"lint": "eslint modules/**/*.js",
"release": "yarn build && npm publish",
"test": "cross-env BABEL_ENV=commonjs jest",
"coverage": "yarn test --coverage"
},
"repository": "https://github.com/robinweser/inline-style-prefixer",
"keywords": [
"react",
"react styling",
"prefixer",
"inline styles",
"autoprefixer",
"vendor prefix",
"userAgent"
],
"author": "Robin Weser",
"license": "MIT",
"jest": {
"rootDir": "modules"
},
"dependencies": {
"css-in-js-utils": "^3.1.0"
},
"devDependencies": {
"babel": "^6.5.2",
"babel-cli": "^6.6.0",
"babel-core": "^6.6.0",
"babel-eslint": "^7.1.1",
"babel-jest": "^20.0.1",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
"caniuse-api": "^3.0.0",
"cross-env": "^5.2.0",
"eslint": "^5.0.0",
"eslint-config-airbnb": "^14.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^3.0.2",
"eslint-plugin-react": "^6.9.0",
"gh-pages": "^1.2.0",
"gitbook": "^3.2.2",
"gitbook-cli": "^2.3.0",
"gitbook-plugin-anker-enable": "0.0.4",
"gitbook-plugin-edit-link": "^2.0.2",
"gitbook-plugin-github": "^2.0.0",
"gitbook-plugin-prism": "^2.4.0",
"jest": "^19.0.2",
"prettier": "^2.2.1",
"rimraf": "^2.6.2"
},
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
}