81 lines
2.2 KiB
JavaScript
81 lines
2.2 KiB
JavaScript
/**
|
|
* Copyright (c) 2013-present, Facebook, Inc.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
|
|
import dangerousStyleValue from './dangerousStyleValue';
|
|
import hyphenateStyleName from './hyphenateStyleName';
|
|
import warnValidStyle from './warnValidStyle';
|
|
|
|
/**
|
|
* Operations for dealing with CSS properties.
|
|
*/
|
|
|
|
/**
|
|
* This creates a string that is expected to be equivalent to the style
|
|
* attribute generated by server-side rendering. It by-passes warnings and
|
|
* security checks so it's not safe to use this value for anything other than
|
|
* comparison. It is only used in DEV for SSR validation.
|
|
*/
|
|
export function createDangerousStringForStyles(styles) {
|
|
if (__DEV__) {
|
|
let serialized = '';
|
|
let delimiter = '';
|
|
for (const styleName in styles) {
|
|
if (!styles.hasOwnProperty(styleName)) {
|
|
continue;
|
|
}
|
|
const styleValue = styles[styleName];
|
|
if (styleValue != null) {
|
|
const isCustomProperty = styleName.indexOf('--') === 0;
|
|
serialized += delimiter + hyphenateStyleName(styleName) + ':';
|
|
serialized += dangerousStyleValue(
|
|
styleName,
|
|
styleValue,
|
|
isCustomProperty,
|
|
);
|
|
|
|
delimiter = ';';
|
|
}
|
|
}
|
|
return serialized || null;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Sets the value for multiple styles on a node. If a value is specified as
|
|
* '' (empty string), the corresponding style property will be unset.
|
|
*
|
|
* @param {DOMElement} node
|
|
* @param {object} styles
|
|
*/
|
|
export function setValueForStyles(node, styles, getStack) {
|
|
const style = node.style;
|
|
for (let styleName in styles) {
|
|
if (!styles.hasOwnProperty(styleName)) {
|
|
continue;
|
|
}
|
|
const isCustomProperty = styleName.indexOf('--') === 0;
|
|
if (__DEV__) {
|
|
if (!isCustomProperty) {
|
|
warnValidStyle(styleName, styles[styleName], getStack);
|
|
}
|
|
}
|
|
const styleValue = dangerousStyleValue(
|
|
styleName,
|
|
styles[styleName],
|
|
isCustomProperty,
|
|
);
|
|
if (styleName === 'float') {
|
|
styleName = 'cssFloat';
|
|
}
|
|
if (isCustomProperty) {
|
|
style.setProperty(styleName, styleValue);
|
|
} else {
|
|
style[styleName] = styleValue;
|
|
}
|
|
}
|
|
}
|