mirror of
https://github.com/zoriya/react-native-web.git
synced 2026-05-27 16:22:20 +00:00
Rename style processors to resolvers
This commit is contained in:
@@ -1,13 +0,0 @@
|
||||
/* eslint-env jasmine, jest */
|
||||
|
||||
import processVendorPrefixes from '../processVendorPrefixes';
|
||||
|
||||
describe('apis/StyleSheet/processVendorPrefixes', () => {
|
||||
test('handles array values', () => {
|
||||
const style = {
|
||||
display: [ '-webkit-flex', 'flex' ]
|
||||
};
|
||||
|
||||
expect(processVendorPrefixes(style)).toEqual({ display: 'flex' });
|
||||
});
|
||||
});
|
||||
+6
-6
@@ -1,14 +1,14 @@
|
||||
/* eslint-env jasmine, jest */
|
||||
|
||||
import processBoxShadow from '../processBoxShadow';
|
||||
import resolveBoxShadow from '../resolveBoxShadow';
|
||||
|
||||
describe('apis/StyleSheet/processBoxShadow', () => {
|
||||
describe('apis/StyleSheet/resolveBoxShadow', () => {
|
||||
test('missing shadowColor', () => {
|
||||
const style = {
|
||||
shadowOffset: { width: 1, height: 2 }
|
||||
};
|
||||
|
||||
expect(processBoxShadow(style)).toEqual({});
|
||||
expect(resolveBoxShadow(style)).toEqual({});
|
||||
});
|
||||
|
||||
test('shadowColor only', () => {
|
||||
@@ -16,7 +16,7 @@ describe('apis/StyleSheet/processBoxShadow', () => {
|
||||
shadowColor: 'red'
|
||||
};
|
||||
|
||||
expect(processBoxShadow(style)).toEqual({
|
||||
expect(resolveBoxShadow(style)).toEqual({
|
||||
boxShadow: '0px 0px 0px rgba(255,0,0,1)'
|
||||
});
|
||||
});
|
||||
@@ -27,7 +27,7 @@ describe('apis/StyleSheet/processBoxShadow', () => {
|
||||
shadowOpacity: 0.5
|
||||
};
|
||||
|
||||
expect(processBoxShadow(style)).toEqual({
|
||||
expect(resolveBoxShadow(style)).toEqual({
|
||||
boxShadow: '0px 0px 0px rgba(255,0,0,0.5)'
|
||||
});
|
||||
});
|
||||
@@ -40,7 +40,7 @@ describe('apis/StyleSheet/processBoxShadow', () => {
|
||||
shadowRadius: 3
|
||||
};
|
||||
|
||||
expect(processBoxShadow(style)).toEqual({
|
||||
expect(resolveBoxShadow(style)).toEqual({
|
||||
boxShadow: '2px 1px 3px rgba(50,60,70,0.25)'
|
||||
});
|
||||
});
|
||||
+3
-3
@@ -1,8 +1,8 @@
|
||||
/* eslint-env jasmine, jest */
|
||||
|
||||
import processTextShadow from '../processTextShadow';
|
||||
import resolveTextShadow from '../resolveTextShadow';
|
||||
|
||||
describe('apis/StyleSheet/processTextShadow', () => {
|
||||
describe('apis/StyleSheet/resolveTextShadow', () => {
|
||||
test('textShadowOffset', () => {
|
||||
const style = {
|
||||
textShadowColor: 'red',
|
||||
@@ -10,7 +10,7 @@ describe('apis/StyleSheet/processTextShadow', () => {
|
||||
textShadowRadius: 5
|
||||
};
|
||||
|
||||
expect(processTextShadow(style)).toEqual({
|
||||
expect(resolveTextShadow(style)).toEqual({
|
||||
textShadow: '2px 2px 5px red',
|
||||
textShadowColor: null,
|
||||
textShadowOffset: null,
|
||||
+4
-4
@@ -1,8 +1,8 @@
|
||||
/* eslint-env jasmine, jest */
|
||||
|
||||
import processTransform from '../processTransform';
|
||||
import resolveTransform from '../resolveTransform';
|
||||
|
||||
describe('apis/StyleSheet/processTransform', () => {
|
||||
describe('apis/StyleSheet/resolveTransform', () => {
|
||||
test('transform', () => {
|
||||
const style = {
|
||||
transform: [
|
||||
@@ -12,7 +12,7 @@ describe('apis/StyleSheet/processTransform', () => {
|
||||
]
|
||||
};
|
||||
|
||||
expect(processTransform(style)).toEqual({ transform: 'scaleX(20) translateX(20px) rotate(20deg)' });
|
||||
expect(resolveTransform(style)).toEqual({ transform: 'scaleX(20) translateX(20px) rotate(20deg)' });
|
||||
});
|
||||
|
||||
test('transformMatrix', () => {
|
||||
@@ -20,7 +20,7 @@ describe('apis/StyleSheet/processTransform', () => {
|
||||
transformMatrix: [ 1, 2, 3, 4, 5, 6 ]
|
||||
};
|
||||
|
||||
expect(processTransform(style)).toEqual({
|
||||
expect(resolveTransform(style)).toEqual({
|
||||
transform: 'matrix3d(1,2,3,4,5,6)',
|
||||
transformMatrix: null
|
||||
});
|
||||
@@ -0,0 +1,13 @@
|
||||
/* eslint-env jasmine, jest */
|
||||
|
||||
import resolveVendorPrefixes from '../resolveVendorPrefixes';
|
||||
|
||||
describe('apis/StyleSheet/resolveVendorPrefixes', () => {
|
||||
test('handles array values', () => {
|
||||
const style = {
|
||||
display: [ '-webkit-flex', 'flex' ]
|
||||
};
|
||||
|
||||
expect(resolveVendorPrefixes(style)).toEqual({ display: 'flex' });
|
||||
});
|
||||
});
|
||||
@@ -1,16 +1,16 @@
|
||||
import expandStyle from './expandStyle';
|
||||
import flattenStyle from './flattenStyle';
|
||||
import i18nStyle from './i18nStyle';
|
||||
import processBoxShadow from './processBoxShadow';
|
||||
import processTextShadow from './processTextShadow';
|
||||
import processTransform from './processTransform';
|
||||
import processVendorPrefixes from './processVendorPrefixes';
|
||||
import resolveBoxShadow from './resolveBoxShadow';
|
||||
import resolveTextShadow from './resolveTextShadow';
|
||||
import resolveTransform from './resolveTransform';
|
||||
import resolveVendorPrefixes from './resolveVendorPrefixes';
|
||||
|
||||
const processors = [
|
||||
processBoxShadow,
|
||||
processTextShadow,
|
||||
processTransform,
|
||||
processVendorPrefixes
|
||||
resolveBoxShadow,
|
||||
resolveTextShadow,
|
||||
resolveTransform,
|
||||
resolveVendorPrefixes
|
||||
];
|
||||
|
||||
const applyProcessors = (style) => processors.reduce((style, processor) => processor(style), style);
|
||||
|
||||
@@ -12,7 +12,7 @@ const applyOpacity = (color, opacity) => {
|
||||
};
|
||||
|
||||
// TODO: add inset and spread support
|
||||
const processBoxShadow = (style) => {
|
||||
const resolveBoxShadow = (style) => {
|
||||
if (style && style.shadowColor) {
|
||||
const { height, width } = style.shadowOffset || {};
|
||||
const opacity = style.shadowOpacity != null ? style.shadowOpacity : 1;
|
||||
@@ -30,4 +30,4 @@ const processBoxShadow = (style) => {
|
||||
return style;
|
||||
};
|
||||
|
||||
module.exports = processBoxShadow;
|
||||
module.exports = resolveBoxShadow;
|
||||
@@ -1,6 +1,6 @@
|
||||
import normalizeValue from './normalizeValue';
|
||||
|
||||
const processTextShadow = (style) => {
|
||||
const resolveTextShadow = (style) => {
|
||||
if (style && style.textShadowOffset) {
|
||||
const { height, width } = style.textShadowOffset;
|
||||
const offsetX = normalizeValue(null, height || 0);
|
||||
@@ -16,4 +16,4 @@ const processTextShadow = (style) => {
|
||||
return style;
|
||||
};
|
||||
|
||||
module.exports = processTextShadow;
|
||||
module.exports = resolveTextShadow;
|
||||
@@ -14,7 +14,7 @@ const convertTransformMatrix = (transformMatrix) => {
|
||||
return `matrix3d(${matrix})`;
|
||||
};
|
||||
|
||||
const processTransform = (style) => {
|
||||
const resolveTransform = (style) => {
|
||||
if (style) {
|
||||
if (style.transform && Array.isArray(style.transform)) {
|
||||
style.transform = style.transform.map(mapTransform).join(' ');
|
||||
@@ -26,4 +26,4 @@ const processTransform = (style) => {
|
||||
return style;
|
||||
};
|
||||
|
||||
module.exports = processTransform;
|
||||
module.exports = resolveTransform;
|
||||
+2
-2
@@ -1,6 +1,6 @@
|
||||
import prefixAll from 'inline-style-prefixer/static';
|
||||
|
||||
const processVendorPrefixes = (style) => {
|
||||
const resolveVendorPrefixes = (style) => {
|
||||
const prefixedStyles = prefixAll(style);
|
||||
// React@15 removed undocumented support for fallback values in
|
||||
// inline-styles. Revert array values to the standard CSS value
|
||||
@@ -13,4 +13,4 @@ const processVendorPrefixes = (style) => {
|
||||
return prefixedStyles;
|
||||
};
|
||||
|
||||
module.exports = processVendorPrefixes;
|
||||
module.exports = resolveVendorPrefixes;
|
||||
@@ -22,7 +22,7 @@ class ReactNativePropRegistry {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Object.freeze(object);
|
||||
}
|
||||
objects[id] = object;
|
||||
objects[`${id}`] = object;
|
||||
return id;
|
||||
}
|
||||
|
||||
@@ -33,7 +33,7 @@ class ReactNativePropRegistry {
|
||||
return emptyObject;
|
||||
}
|
||||
|
||||
const object = objects[id];
|
||||
const object = objects[`${id}`];
|
||||
if (!object) {
|
||||
console.warn('Invalid style with id `' + id + '`. Skipping ...');
|
||||
return emptyObject;
|
||||
|
||||
Reference in New Issue
Block a user