diff options
author | Sebastian <sebasjm@gmail.com> | 2021-08-23 16:46:06 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-08-23 16:48:30 -0300 |
commit | 38acabfa6089ab8ac469c12b5f55022fb96935e5 (patch) | |
tree | 453dbf70000cc5e338b06201af1eaca8343f8f73 /@linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts | |
parent | f26125e039143b92dc0d84e7775f508ab0cdcaa8 (diff) | |
download | node-vendor-38acabfa6089ab8ac469c12b5f55022fb96935e5.tar.gz node-vendor-38acabfa6089ab8ac469c12b5f55022fb96935e5.tar.bz2 node-vendor-38acabfa6089ab8ac469c12b5f55022fb96935e5.zip |
Diffstat (limited to '@linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts')
-rw-r--r-- | @linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/@linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts b/@linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts new file mode 100644 index 0000000..a9e38c5 --- /dev/null +++ b/@linaria/packages/babel/src/evaluators/visitors/ProcessStyled.ts @@ -0,0 +1,46 @@ +/** + * This visitor replaces styled components with metadata about them. + * CallExpression should be used to match styled components. + * Works out of the box for styled that wraps other component, + * styled.tagName are transformed to call expressions using @babel/plugin-transform-template-literals + * @babel/plugin-transform-template-literals is loaded as a prest, to force proper ordering. It has to run just after linaria. + * It is used explicitly in extractor, and loaded as a part of `prest-env` in shaker + */ + +import { types as t } from '@babel/core'; +import type { NodePath } from '@babel/traverse'; +import type { CallExpression } from '@babel/types'; +import { expression } from '@babel/template'; +import getLinariaComment from '../../utils/getLinariaComment'; + +const linariaComponentTpl = expression( + `{ + displayName: %%displayName%%, + __linaria: { + className: %%className%%, + extends: %%extends%% + } + }` +); + +export default function ProcessStyled(path: NodePath<CallExpression>) { + const [type, , displayName, className] = getLinariaComment(path); + if (!className) { + return; + } + + if (type === 'css') { + path.replaceWith(t.stringLiteral(className)); + return; + } + + path.replaceWith( + linariaComponentTpl({ + className: t.stringLiteral(className), + displayName: displayName ? t.stringLiteral(displayName) : null, + extends: t.isCallExpression(path.node.callee) + ? path.node.callee.arguments[0] + : t.nullLiteral(), + }) + ); +} |