/** * Copyright (c) Nicolas Gallagher. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * * @flow */ import normalizeValueWithProperty from './normalizeValueWithProperty'; import canUseDOM from '../../../modules/canUseDom'; type Style = { [key: string]: any }; /** * The browser implements the CSS cascade, where the order of properties is a * factor in determining which styles to paint. React Native is different. It * gives giving precedence to the more specific style property. For example, * the value of `paddingTop` takes precedence over that of `padding`. * * This module creates mutally exclusive style declarations by expanding all of * React Native's supported shortform properties (e.g. `padding`) to their * longfrom equivalents. */ const emptyObject = {}; const supportsCSS3TextDecoration = !canUseDOM || window.CSS != null && window.CSS.supports != null && (window.CSS.supports('text-decoration-line', 'none') || window.CSS.supports('-webkit-text-decoration-line', 'none')); const MONOSPACE_FONT_STACK = 'monospace,monospace'; const SYSTEM_FONT_STACK = '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif'; const STYLE_SHORT_FORM_EXPANSIONS = { borderColor: ['borderTopColor', 'borderRightColor', 'borderBottomColor', 'borderLeftColor'], borderBlockColor: ['borderTopColor', 'borderBottomColor'], borderInlineColor: ['borderRightColor', 'borderLeftColor'], borderRadius: ['borderTopLeftRadius', 'borderTopRightRadius', 'borderBottomRightRadius', 'borderBottomLeftRadius'], borderStyle: ['borderTopStyle', 'borderRightStyle', 'borderBottomStyle', 'borderLeftStyle'], borderBlockStyle: ['borderTopStyle', 'borderBottomStyle'], borderInlineStyle: ['borderRightStyle', 'borderLeftStyle'], borderWidth: ['borderTopWidth', 'borderRightWidth', 'borderBottomWidth', 'borderLeftWidth'], borderBlockWidth: ['borderTopWidth', 'borderBottomWidth'], borderInlineWidth: ['borderRightWidth', 'borderLeftWidth'], insetBlock: ['top', 'bottom'], insetInline: ['left', 'right'], marginBlock: ['marginTop', 'marginBottom'], marginInline: ['marginRight', 'marginLeft'], paddingBlock: ['paddingTop', 'paddingBottom'], paddingInline: ['paddingRight', 'paddingLeft'], overflow: ['overflowX', 'overflowY'], overscrollBehavior: ['overscrollBehaviorX', 'overscrollBehaviorY'], borderBlockStartColor: ['borderTopColor'], borderBlockStartStyle: ['borderTopStyle'], borderBlockStartWidth: ['borderTopWidth'], borderBlockEndColor: ['borderBottomColor'], borderBlockEndStyle: ['borderBottomStyle'], borderBlockEndWidth: ['borderBottomWidth'], //borderInlineStartColor: ['borderLeftColor'], //borderInlineStartStyle: ['borderLeftStyle'], //borderInlineStartWidth: ['borderLeftWidth'], //borderInlineEndColor: ['borderRightColor'], //borderInlineEndStyle: ['borderRightStyle'], //borderInlineEndWidth: ['borderRightWidth'], borderEndStartRadius: ['borderBottomLeftRadius'], borderEndEndRadius: ['borderBottomRightRadius'], borderStartStartRadius: ['borderTopLeftRadius'], borderStartEndRadius: ['borderTopRightRadius'], insetBlockEnd: ['bottom'], insetBlockStart: ['top'], //insetInlineEnd: ['right'], //insetInlineStart: ['left'], marginBlockStart: ['marginTop'], marginBlockEnd: ['marginBottom'], //marginInlineStart: ['marginLeft'], //marginInlineEnd: ['marginRight'], paddingBlockStart: ['paddingTop'], paddingBlockEnd: ['paddingBottom'] //paddingInlineStart: ['marginLeft'], //paddingInlineEnd: ['marginRight'], }; /** * Reducer */ declare var createReactDOMStyle: (style: Style, isInline?: boolean) => Style; export default createReactDOMStyle;