fix(babel, react, shaker): tag in runtime is not supported (fixes #1021)

callstack · Jul 26, 2022 · 2abc55b · 2abc55b
1 parent c5ed76e
commit 2abc55b
Show file tree

Hide file tree

Showing 7 changed files with 22 additions and 10 deletions.
diff --git a/.changeset/three-emus-turn.md b/.changeset/three-emus-turn.md
@@ -0,0 +1,7 @@
+---
+'@linaria/babel-preset': patch
+'@linaria/react': patch
+'@linaria/shaker': patch
+---
+
+Fix 'Using the tag in runtime is not supported' in some enviroments (fixes #1021)
diff --git a/packages/babel/src/index.ts b/packages/babel/src/index.ts
@@ -30,7 +30,7 @@ export { default as peek } from './utils/peek';
 export { default as processTemplateExpression } from './utils/processTemplateExpression';
 
 function isEnabled(caller?: TransformCaller & { evaluate?: true }) {
-  return caller?.name !== 'linaria' || !caller.evaluate;
+  return caller?.name !== 'linaria' || caller.evaluate === true;
 }
 
 export default function linaria(babel: ConfigAPI, options: PluginOptions) {

diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
@@ -1,2 +1,4 @@
 export { default as styled } from './styled';
+export type { StyledJSXIntrinsics, Styled } from './styled';
 export type { CSSProperties } from '@linaria/core';
+export type { StyledMeta } from '@linaria/tags';
diff --git a/packages/react/src/processors/styled.ts b/packages/react/src/processors/styled.ts
@@ -48,13 +48,13 @@ export default class StyledProcessor extends TaggedTemplateProcessor {
   constructor(params: Params, ...args: TailProcessorParams) {
     validateParams(
       params,
-      ['tag', ['call', 'member'], 'template'],
+      ['tag', ['call', 'member'], ['template', 'call']],
       'Invalid usage of `styled` tag'
     );
 
     const [tag, tagOp, template] = params;
 
-    super([tag, template], ...args);
+    super([tag, template[0] === 'call' ? ['template', []] : template], ...args);
 
     let component: WrappedNode | undefined;
     if (tagOp[0] === 'call' && tagOp.length === 2) {

diff --git a/packages/react/src/styled.ts b/packages/react/src/styled.ts
@@ -246,7 +246,7 @@ type ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <OwnProps = {}>(
   ? StyledMeta & TOrigCmp
   : StyledComponent<OwnProps & TTrgProps>;
 
-type StyledJSXIntrinsics = {
+export type StyledJSXIntrinsics = {
   readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;
 };
 

diff --git a/packages/shaker/src/index.ts b/packages/shaker/src/index.ts
@@ -19,6 +19,9 @@ const getShakerConfig = (only: string[] | null): TransformOptions => {
 
   const config = {
     ast: true,
+    caller: {
+      name: 'linaria',
+    },
     envName: 'linaria',
     targets: {
       node: 'current',

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml