How to use the inline-style-prefixer/static/createPrefixer function in inline-style-prefixer

To help you get started, we’ve selected a few inline-style-prefixer examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github vincentriemer / react-native-dom / packages / react-native-dom / ReactDom / utils / prefixInlineStyles.js View on Github external
/**
 * @providesModule prefixInlineStyles
 * @flow
 */

import createPrefixer from "inline-style-prefixer/static/createPrefixer";

import staticData from "./static";

const prefixAll = createPrefixer(staticData);

export default prefixAll;

export const prefixInlineStyles = (style: Object) => {
  const prefixedStyles = prefixAll(style);

  // React@15 removed undocumented support for fallback values in
  // inline-styles. Revert array values to the standard CSS value
  Object.keys(prefixedStyles).forEach((prop) => {
    const value = prefixedStyles[prop];
    if (Array.isArray(value)) {
      prefixedStyles[prop] = value[value.length - 1];
    }
  });

  return prefixedStyles;
github necolas / react-native-web / src / modules / prefixStyles / index.js View on Github external
/**
 * Copyright (c) 2015-present, Nicolas Gallagher.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree.
 *
 * @flow
 */

import createPrefixer from 'inline-style-prefixer/static/createPrefixer';
import staticData from './static';

const prefixAll = createPrefixer(staticData);

export default prefixAll;

export const prefixInlineStyles = (style: Object) => {
  const prefixedStyles = prefixAll(style);

  // React@15 removed undocumented support for fallback values in
  // inline-styles. Revert array values to the standard CSS value
  Object.keys(prefixedStyles).forEach(prop => {
    const value = prefixedStyles[prop];
    if (Array.isArray(value)) {
      prefixedStyles[prop] = value[value.length - 1];
    }
  });

  return prefixedStyles;
github FormidableLabs / radium / src / prefixer.js View on Github external
* Based on https://github.com/jsstyles/css-vendor, but without having to
 * convert between different cases all the time.
 *
 * @flow
 */

import createStaticPrefixer from 'inline-style-prefixer/static/createPrefixer';
import createDynamicPrefixer from 'inline-style-prefixer/dynamic/createPrefixer';
import ExecutionEnvironment from 'exenv';

import staticData from './prefix-data/static';
import dynamicData from './prefix-data/dynamic';

import {camelCaseToDashCase} from './camel-case-props-to-dash-case';

const prefixAll: (style: Object) => Object = createStaticPrefixer(staticData);
const InlineStylePrefixer = createDynamicPrefixer(dynamicData, prefixAll);

function transformValues(style) {
  return Object.keys(style).reduce((newStyle, key) => {
    let value = style[key];
    if (Array.isArray(value)) {
      value = value.join(';' + key + ':');
    } else if (
      value &&
      typeof value === 'object' &&
      typeof value.toString === 'function'
    ) {
      value = value.toString();
    }

    newStyle[key] = value;