Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
UIDLUtils.traverseElements(uidl.node, (element) => {
const { style, key } = element
if (style) {
const root = astNodesLookup[key]
const { staticStyles, dynamicStyles } = UIDLUtils.splitDynamicAndStaticStyles(style)
if (Object.keys(staticStyles).length > 0) {
const className = StringUtils.camelCaseToDashCase(key)
const jsFriendlyClassName = StringUtils.dashCaseToCamelCase(className)
cssClasses.push(
StyleBuilders.createCSSClass(
className,
StyleUtils.getContentOfStyleObject(staticStyles)
)
)
// When the className is equal to the jsFriendlyClassName, it can be safely addressed with `styles.`
const classNameIsJSFriendly = className === jsFriendlyClassName
const classReferenceIdentifier =
camelCaseClassNames || classNameIsJSFriendly
? `styles.${jsFriendlyClassName}`
: `styles['${className}']`
ASTUtils.addDynamicAttributeToJSXTag(root, classAttributeName, classReferenceIdentifier)
UIDLUtils.traverseElements(uidl.node, (element) => {
const { style, key } = element
if (style) {
const root = astNodesLookup[key]
const { staticStyles, dynamicStyles } = UIDLUtils.splitDynamicAndStaticStyles(style)
if (Object.keys(staticStyles).length > 0) {
const className = StringUtils.camelCaseToDashCase(key)
const jsFriendlyClassName = StringUtils.dashCaseToCamelCase(className)
cssClasses.push(
StyleBuilders.createCSSClass(
className,
StyleUtils.getContentOfStyleObject(staticStyles)
)
)
// When the className is equal to the jsFriendlyClassName, it can be safely addressed with `styles.`
const classNameIsJSFriendly = className === jsFriendlyClassName
const classReferenceIdentifier =
camelCaseClassNames || classNameIsJSFriendly
? `styles.${jsFriendlyClassName}`
: `styles['${className}']`
ASTUtils.addDynamicAttributeToJSXTag(root, classAttributeName, classReferenceIdentifier)
(styleValue, attribute) => {
if (styleValue.content.referenceType === 'prop') {
const dashCaseAttribute = StringUtils.dashCaseToCamelCase(attribute)
switch (timesReferred) {
case 1:
ASTUtils.addDynamicAttributeToJSXTag(
root,
dashCaseAttribute,
styleValue.content.id,
propsPrefix
)
return `\$\{props => props.${dashCaseAttribute}\}`
default:
return `\$\{props => props.${styleValue.content.id}\}`
}
}
throw new Error(
`Error running transformDynamicStyles in reactStyledComponentsPlugin. Unsupported styleValue.content.referenceType value ${styleValue.content.referenceType}`
)