Safeguard Container style when used cross-platform

This commit is contained in:
Bettenbuk Zoltan 2019-04-29 13:37:30 +02:00
parent b886f8d72d
commit 31638133b7
4 changed files with 53 additions and 1 deletions

View File

@ -2,6 +2,8 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { getFixedPlatformStyle } from '../../styles';
/** /**
* {@code AbstractContainer} component's property types. * {@code AbstractContainer} component's property types.
*/ */
@ -80,6 +82,7 @@ export default class AbstractContainer<P: Props> extends Component<P> {
_render(type, props?: P) { _render(type, props?: P) {
const { const {
children, children,
style,
/* eslint-disable no-unused-vars */ /* eslint-disable no-unused-vars */
@ -94,7 +97,12 @@ export default class AbstractContainer<P: Props> extends Component<P> {
...filteredProps ...filteredProps
} = props || this.props; } = props || this.props;
const _style = getFixedPlatformStyle(style);
// $FlowFixMe // $FlowFixMe
return React.createElement(type, filteredProps, children); return React.createElement(type, {
style: _style,
...filteredProps
}, children);
} }
} }

View File

@ -0,0 +1,18 @@
// @flow
import { type StyleType } from './functions.any';
export * from './functions.any';
/**
* Fixes the style prop that is passed to a platform generic component based on platform specific
* format requirements.
*
* @param {StyleType} style - The passed style prop to the component.
* @returns {StyleType}
*/
export function getFixedPlatformStyle(style: StyleType): StyleType {
// There is nothing to do on mobile - yet.
return style;
}

View File

@ -0,0 +1,26 @@
// @flow
import { type StyleType } from './functions.any';
export * from './functions.any';
/**
* Fixes the style prop that is passed to a platform generic component based on platform specific
* format requirements.
*
* @param {StyleType} style - The passed style prop to the component.
* @returns {StyleType}
*/
export function getFixedPlatformStyle(style: StyleType): StyleType {
if (Array.isArray(style)) {
const _style = {};
for (const component of style) {
Object.assign(_style, component);
}
return _style;
}
return style;
}