Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
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)
}
if (Object.keys(dynamicStyles).length) {
const rootStyles = UIDLUtils.cleanupNestedStyles(dynamicStyles)
const inlineStyles = UIDLUtils.transformDynamicStyles(rootStyles, (styleValue) =>
StyleBuilders.createDynamicStyleExpression(styleValue, propsPrefix)
)
// If dynamic styles are on nested-styles they are unfortunately lost, since inline style does not support that
if (Object.keys(inlineStyles).length > 0) {
ASTUtils.addAttributeToJSXTag(root, 'style', inlineStyles)
}
}
}
})
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)
}
if (Object.keys(dynamicStyles).length) {
const rootStyles = UIDLUtils.cleanupNestedStyles(dynamicStyles)
const inlineStyles = UIDLUtils.transformDynamicStyles(rootStyles, (styleValue) =>
StyleBuilders.createDynamicStyleExpression(styleValue, propsPrefix)
)
// If dynamic styles are on nested-styles they are unfortunately lost, since inline style does not support that
if (Object.keys(inlineStyles).length > 0) {
ASTUtils.addAttributeToJSXTag(root, 'style', inlineStyles)
}
}
}
})
export const constructRouteJSX = (flavour: string, componentName: string, path: string) => {
let JSXRoutePrefix: string
let route: types.JSXElement
if (flavour === 'preact') {
JSXRoutePrefix = componentName
route = ASTBuilders.createSelfClosingJSXTag(JSXRoutePrefix)
} else {
JSXRoutePrefix = 'Route'
route = ASTBuilders.createSelfClosingJSXTag(JSXRoutePrefix)
ASTUtils.addAttributeToJSXTag(route, 'exact')
ASTUtils.addDynamicAttributeToJSXTag(route, 'component', componentName)
}
ASTUtils.addAttributeToJSXTag(route, 'path', path)
return route
}
UIDLUtils.traverseElements(node, (element) => {
const { style, key } = element
if (style && Object.keys(style).length > 0) {
const root = jsxNodesLookup[key]
const className = StringUtils.camelCaseToDashCase(key)
jssStyleMap[className] = UIDLUtils.transformDynamicStyles(style, (styleValue) => {
if (styleValue.content.referenceType === 'prop') {
return new ParsedASTNode(
ASTBuilders.createArrowFunctionWithMemberExpression('props', styleValue.content.id)
)
}
throw new Error(
`Error running transformDynamicStyles in reactJSSComponentStyleChunksPlugin. Unsupported styleValue.content.referenceType value ${styleValue.content.referenceType}`
)
})
ASTUtils.addDynamicAttributeToJSXTag(
root,
classAttributeName,
`classes['${className}']`,
propsPrefix
)
}
})
(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}`
)
}
)