@linaria/react 4.0.0-beta.1 → 4.0.0

package/esm/processors/styled.js

@@ -1,4 +1,4 @@
-import { BaseProcessor, ValueType, hasMeta } from '@linaria/tags';
+import { TaggedTemplateProcessor, ValueType, hasMeta, validateParams } from '@linaria/tags';
 
 const isNotNull = x => x !== null;
 
@@ -11,16 +11,19 @@ const singleQuotedStringLiteral = value => ({
   }
 });
 
-export default class StyledProcessor extends BaseProcessor {
+export default class StyledProcessor extends TaggedTemplateProcessor {
   #variableIdx = 0;
   #variablesCache = new Map();
 
-  constructor(...args) {
-    super(...args);
+  constructor(params, ...args) {
+    validateParams(params, ['tag', ['call', 'member'], 'template'], 'Invalid usage of `styled` tag');
+    const [tag, tagOp, template] = params;
+    super([tag, template], ...args);
     let component;
-    const [type, value, ...rest] = this.params[0] ?? [];
 
-    if (type === 'call' && rest.length === 0) {
+    if (tagOp[0] === 'call' && tagOp.length === 2) {
+      const value = tagOp[1];
+
       if (value.kind === ValueType.FUNCTION) {
         component = 'FunctionalComponent';
       } else {
@@ -32,11 +35,11 @@ export default class StyledProcessor extends BaseProcessor {
       }
     }
 
-    if (type === 'member') {
-      component = value;
+    if (tagOp[0] === 'member') {
+      [, component] = tagOp;
     }
 
-    if (!component || this.params.length > 1) {
+    if (!component) {
       throw new Error('Invalid usage of `styled` tag');
     }
 
@@ -106,7 +109,7 @@ export default class StyledProcessor extends BaseProcessor {
 
   get tagExpression() {
     const t = this.astService;
-    return t.callExpression(this.tagExp, [this.tagExpressionArgument]);
+    return t.callExpression(this.tag, [this.tagExpressionArgument]);
   }
 
   get value() {
@@ -115,6 +118,20 @@ export default class StyledProcessor extends BaseProcessor {
     return t.objectExpression([t.objectProperty(t.stringLiteral('displayName'), t.stringLiteral(this.displayName)), t.objectProperty(t.stringLiteral('__linaria'), t.objectExpression([t.objectProperty(t.stringLiteral('className'), t.stringLiteral(this.className)), t.objectProperty(t.stringLiteral('extends'), extendsNode ? t.callExpression(t.identifier(extendsNode), []) : t.nullLiteral())]))]);
   }
 
+  toString() {
+    const res = arg => `${this.tagSourceCode()}(${arg})\`…\``;
+
+    if (typeof this.component === 'string') {
+      if (this.component === 'FunctionalComponent') {
+        return res('() => {…}');
+      }
+
+      return res(`'${this.component}'`);
+    }
+
+    return res(this.component.source);
+  }
+
   getProps() {
     const propsObj = {
       name: this.displayName,

package/esm/processors/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["BaseProcessor","ValueType","hasMeta","isNotNull","x","singleQuotedStringLiteral","value","type","extra","rawValue","raw","StyledProcessor","variableIdx","variablesCache","Map","constructor","args","component","rest","params","length","kind","FUNCTION","node","ex","source","dependencies","push","Error","addInterpolation","unit","id","getVariableId","interpolations","doEvaltimeReplacement","replacer","doRuntimeReplacement","t","astService","props","getProps","callExpression","tagExpression","getTagComponentProps","extractRules","valueCache","cssText","loc","rules","selector","className","get","name","__linaria","extends","displayName","start","asSelector","tagExpressionArgument","arrowFunctionExpression","blockStatement","identifier","tagExp","extendsNode","objectExpression","objectProperty","stringLiteral","nullLiteral","propsObj","class","vars","forEach","items","propExpressions","Object","entries","map","key","keyNode","booleanLiteral","propName","propValue","arrayExpression","filter","has","set","slug"],"sources":["../../src/processors/styled.ts"],"sourcesContent":["import type {\n  CallExpression,\n  Expression,\n  ObjectExpression,\n  SourceLocation,\n  StringLiteral,\n} from '@babel/types';\n\nimport { BaseProcessor, ValueType, hasMeta } from '@linaria/tags';\nimport type {\n  Rules,\n  WrappedNode,\n  ValueCache,\n  ProcessorParams,\n} from '@linaria/tags';\n\nconst isNotNull = <T>(x: T | null): x is T => x !== null;\n\nexport interface IProps {\n  atomic?: boolean;\n  class?: string;\n  name: string;\n  vars?: Record<string, Expression[]>;\n}\n\nconst singleQuotedStringLiteral = (value: string): StringLiteral => ({\n  type: 'StringLiteral',\n  value,\n  extra: {\n    rawValue: value,\n    raw: `'${value}'`,\n  },\n});\n\nexport default class StyledProcessor extends BaseProcessor {\n  public component: WrappedNode;\n\n  #variableIdx = 0;\n\n  #variablesCache = new Map<string, string>();\n\n  constructor(...args: ProcessorParams) {\n    super(...args);\n\n    let component: WrappedNode | undefined;\n    const [type, value, ...rest] = this.params[0] ?? [];\n    if (type === 'call' && rest.length === 0) {\n      if (value.kind === ValueType.FUNCTION) {\n        component = 'FunctionalComponent';\n      } else {\n        component = {\n          node: value.ex,\n          source: value.source,\n        };\n\n        this.dependencies.push(value);\n      }\n    }\n\n    if (type === 'member') {\n      component = value;\n    }\n\n    if (!component || this.params.length > 1) {\n      throw new Error('Invalid usage of `styled` tag');\n    }\n\n    this.component = component;\n  }\n\n  public override addInterpolation(\n    node: Expression,\n    source: string,\n    unit = ''\n  ): string {\n    const id = this.getVariableId(source + unit);\n\n    this.interpolations.push({\n      id,\n      node,\n      source,\n      unit,\n    });\n\n    return id;\n  }\n\n  public override doEvaltimeReplacement(): void {\n    this.replacer(this.value, false);\n  }\n\n  public override doRuntimeReplacement(): void {\n    const t = this.astService;\n\n    const props = this.getProps();\n\n    this.replacer(\n      t.callExpression(this.tagExpression, [this.getTagComponentProps(props)]),\n      true\n    );\n  }\n\n  public override extractRules(\n    valueCache: ValueCache,\n    cssText: string,\n    loc?: SourceLocation | null\n  ): Rules {\n    const rules: Rules = {};\n\n    let selector = `.${this.className}`;\n\n    // If `styled` wraps another component and not a primitive,\n    // get its class name to create a more specific selector\n    // it'll ensure that styles are overridden properly\n    let value =\n      typeof this.component === 'string'\n        ? null\n        : valueCache.get(this.component.node.name);\n    while (hasMeta(value)) {\n      selector += `.${value.__linaria.className}`;\n      value = value.__linaria.extends;\n    }\n\n    rules[selector] = {\n      cssText,\n      className: this.className,\n      displayName: this.displayName,\n      start: loc?.start ?? null,\n    };\n\n    return rules;\n  }\n\n  public override get asSelector(): string {\n    return `.${this.className}`;\n  }\n\n  protected get tagExpressionArgument(): Expression {\n    const t = this.astService;\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return t.arrowFunctionExpression([], t.blockStatement([]));\n      }\n\n      return singleQuotedStringLiteral(this.component);\n    }\n\n    return t.callExpression(t.identifier(this.component.node.name), []);\n  }\n\n  protected get tagExpression(): CallExpression {\n    const t = this.astService;\n    return t.callExpression(this.tagExp, [this.tagExpressionArgument]);\n  }\n\n  public override get value(): ObjectExpression {\n    const t = this.astService;\n    const extendsNode =\n      typeof this.component === 'string' ? null : this.component.node.name;\n\n    return t.objectExpression([\n      t.objectProperty(\n        t.stringLiteral('displayName'),\n        t.stringLiteral(this.displayName)\n      ),\n      t.objectProperty(\n        t.stringLiteral('__linaria'),\n        t.objectExpression([\n          t.objectProperty(\n            t.stringLiteral('className'),\n            t.stringLiteral(this.className)\n          ),\n          t.objectProperty(\n            t.stringLiteral('extends'),\n            extendsNode\n              ? t.callExpression(t.identifier(extendsNode), [])\n              : t.nullLiteral()\n          ),\n        ])\n      ),\n    ]);\n  }\n\n  protected getProps(): IProps {\n    const propsObj: IProps = {\n      name: this.displayName,\n      class: this.className,\n    };\n\n    // If we found any interpolations, also pass them, so they can be applied\n    if (this.interpolations.length) {\n      propsObj.vars = {};\n      this.interpolations.forEach(({ id, unit, node }) => {\n        const items: Expression[] = [this.astService.callExpression(node, [])];\n\n        if (unit) {\n          items.push(this.astService.stringLiteral(unit));\n        }\n\n        propsObj.vars![id] = items;\n      });\n    }\n\n    return propsObj;\n  }\n\n  protected getTagComponentProps(props: IProps): ObjectExpression {\n    const t = this.astService;\n\n    const propExpressions = Object.entries(props)\n      .map(([key, value]: [key: string, value: IProps[keyof IProps]]) => {\n        if (!value) {\n          return null;\n        }\n\n        const keyNode = t.identifier(key);\n\n        if (typeof value === 'string') {\n          return t.objectProperty(keyNode, t.stringLiteral(value));\n        }\n\n        if (typeof value === 'boolean') {\n          return t.objectProperty(keyNode, t.booleanLiteral(value));\n        }\n\n        const vars = Object.entries(value).map(([propName, propValue]) => {\n          return t.objectProperty(\n            t.stringLiteral(propName),\n            t.arrayExpression(propValue)\n          );\n        });\n\n        return t.objectProperty(keyNode, t.objectExpression(vars));\n      })\n      .filter(isNotNull);\n\n    return t.objectExpression(propExpressions);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  protected getVariableId(value: string): string {\n    if (!this.#variablesCache.has(value)) {\n      // make the variable unique to this styled component\n      // eslint-disable-next-line no-plusplus\n      this.#variablesCache.set(value, `${this.slug}-${this.#variableIdx++}`);\n    }\n\n    return this.#variablesCache.get(value)!;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["TaggedTemplateProcessor","ValueType","hasMeta","validateParams","isNotNull","x","singleQuotedStringLiteral","value","type","extra","rawValue","raw","StyledProcessor","variableIdx","variablesCache","Map","constructor","params","args","tag","tagOp","template","component","length","kind","FUNCTION","node","ex","source","dependencies","push","Error","addInterpolation","unit","id","getVariableId","interpolations","doEvaltimeReplacement","replacer","doRuntimeReplacement","t","astService","props","getProps","callExpression","tagExpression","getTagComponentProps","extractRules","valueCache","cssText","loc","rules","selector","className","get","name","__linaria","extends","displayName","start","asSelector","tagExpressionArgument","arrowFunctionExpression","blockStatement","identifier","extendsNode","objectExpression","objectProperty","stringLiteral","nullLiteral","toString","res","arg","tagSourceCode","propsObj","class","vars","forEach","items","propExpressions","Object","entries","map","key","keyNode","booleanLiteral","propName","propValue","arrayExpression","filter","has","set","slug"],"sources":["../../src/processors/styled.ts"],"sourcesContent":["import type {\n  CallExpression,\n  Expression,\n  ObjectExpression,\n  SourceLocation,\n  StringLiteral,\n} from '@babel/types';\n\nimport type {\n  Rules,\n  WrappedNode,\n  ValueCache,\n  Params,\n  TailProcessorParams,\n} from '@linaria/tags';\nimport {\n  TaggedTemplateProcessor,\n  ValueType,\n  hasMeta,\n  validateParams,\n} from '@linaria/tags';\n\nconst isNotNull = <T>(x: T | null): x is T => x !== null;\n\nexport interface IProps {\n  atomic?: boolean;\n  class?: string;\n  name: string;\n  vars?: Record<string, Expression[]>;\n}\n\nconst singleQuotedStringLiteral = (value: string): StringLiteral => ({\n  type: 'StringLiteral',\n  value,\n  extra: {\n    rawValue: value,\n    raw: `'${value}'`,\n  },\n});\n\nexport default class StyledProcessor extends TaggedTemplateProcessor {\n  public component: WrappedNode;\n\n  #variableIdx = 0;\n\n  #variablesCache = new Map<string, string>();\n\n  constructor(params: Params, ...args: TailProcessorParams) {\n    validateParams(\n      params,\n      ['tag', ['call', 'member'], 'template'],\n      'Invalid usage of `styled` tag'\n    );\n\n    const [tag, tagOp, template] = params;\n\n    super([tag, template], ...args);\n\n    let component: WrappedNode | undefined;\n    if (tagOp[0] === 'call' && tagOp.length === 2) {\n      const value = tagOp[1];\n      if (value.kind === ValueType.FUNCTION) {\n        component = 'FunctionalComponent';\n      } else {\n        component = {\n          node: value.ex,\n          source: value.source,\n        };\n\n        this.dependencies.push(value);\n      }\n    }\n\n    if (tagOp[0] === 'member') {\n      [, component] = tagOp;\n    }\n\n    if (!component) {\n      throw new Error('Invalid usage of `styled` tag');\n    }\n\n    this.component = component;\n  }\n\n  public override addInterpolation(\n    node: Expression,\n    source: string,\n    unit = ''\n  ): string {\n    const id = this.getVariableId(source + unit);\n\n    this.interpolations.push({\n      id,\n      node,\n      source,\n      unit,\n    });\n\n    return id;\n  }\n\n  public override doEvaltimeReplacement(): void {\n    this.replacer(this.value, false);\n  }\n\n  public override doRuntimeReplacement(): void {\n    const t = this.astService;\n\n    const props = this.getProps();\n\n    this.replacer(\n      t.callExpression(this.tagExpression, [this.getTagComponentProps(props)]),\n      true\n    );\n  }\n\n  public override extractRules(\n    valueCache: ValueCache,\n    cssText: string,\n    loc?: SourceLocation | null\n  ): Rules {\n    const rules: Rules = {};\n\n    let selector = `.${this.className}`;\n\n    // If `styled` wraps another component and not a primitive,\n    // get its class name to create a more specific selector\n    // it'll ensure that styles are overridden properly\n    let value =\n      typeof this.component === 'string'\n        ? null\n        : valueCache.get(this.component.node.name);\n    while (hasMeta(value)) {\n      selector += `.${value.__linaria.className}`;\n      value = value.__linaria.extends;\n    }\n\n    rules[selector] = {\n      cssText,\n      className: this.className,\n      displayName: this.displayName,\n      start: loc?.start ?? null,\n    };\n\n    return rules;\n  }\n\n  public override get asSelector(): string {\n    return `.${this.className}`;\n  }\n\n  protected get tagExpressionArgument(): Expression {\n    const t = this.astService;\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return t.arrowFunctionExpression([], t.blockStatement([]));\n      }\n\n      return singleQuotedStringLiteral(this.component);\n    }\n\n    return t.callExpression(t.identifier(this.component.node.name), []);\n  }\n\n  protected get tagExpression(): CallExpression {\n    const t = this.astService;\n    return t.callExpression(this.tag, [this.tagExpressionArgument]);\n  }\n\n  public override get value(): ObjectExpression {\n    const t = this.astService;\n    const extendsNode =\n      typeof this.component === 'string' ? null : this.component.node.name;\n\n    return t.objectExpression([\n      t.objectProperty(\n        t.stringLiteral('displayName'),\n        t.stringLiteral(this.displayName)\n      ),\n      t.objectProperty(\n        t.stringLiteral('__linaria'),\n        t.objectExpression([\n          t.objectProperty(\n            t.stringLiteral('className'),\n            t.stringLiteral(this.className)\n          ),\n          t.objectProperty(\n            t.stringLiteral('extends'),\n            extendsNode\n              ? t.callExpression(t.identifier(extendsNode), [])\n              : t.nullLiteral()\n          ),\n        ])\n      ),\n    ]);\n  }\n\n  public override toString(): string {\n    const res = (arg: string) => `${this.tagSourceCode()}(${arg})\\`…\\``;\n\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return res('() => {…}');\n      }\n\n      return res(`'${this.component}'`);\n    }\n\n    return res(this.component.source);\n  }\n\n  protected getProps(): IProps {\n    const propsObj: IProps = {\n      name: this.displayName,\n      class: this.className,\n    };\n\n    // If we found any interpolations, also pass them, so they can be applied\n    if (this.interpolations.length) {\n      propsObj.vars = {};\n      this.interpolations.forEach(({ id, unit, node }) => {\n        const items: Expression[] = [this.astService.callExpression(node, [])];\n\n        if (unit) {\n          items.push(this.astService.stringLiteral(unit));\n        }\n\n        propsObj.vars![id] = items;\n      });\n    }\n\n    return propsObj;\n  }\n\n  protected getTagComponentProps(props: IProps): ObjectExpression {\n    const t = this.astService;\n\n    const propExpressions = Object.entries(props)\n      .map(([key, value]: [key: string, value: IProps[keyof IProps]]) => {\n        if (!value) {\n          return null;\n        }\n\n        const keyNode = t.identifier(key);\n\n        if (typeof value === 'string') {\n          return t.objectProperty(keyNode, t.stringLiteral(value));\n        }\n\n        if (typeof value === 'boolean') {\n          return t.objectProperty(keyNode, t.booleanLiteral(value));\n        }\n\n        const vars = Object.entries(value).map(([propName, propValue]) => {\n          return t.objectProperty(\n            t.stringLiteral(propName),\n            t.arrayExpression(propValue)\n          );\n        });\n\n        return t.objectProperty(keyNode, t.objectExpression(vars));\n      })\n      .filter(isNotNull);\n\n    return t.objectExpression(propExpressions);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  protected getVariableId(value: string): string {\n    if (!this.#variablesCache.has(value)) {\n      // make the variable unique to this styled component\n      // eslint-disable-next-line no-plusplus\n      this.#variablesCache.set(value, `${this.slug}-${this.#variableIdx++}`);\n    }\n\n    return this.#variablesCache.get(value)!;\n  }\n}\n"],"mappings":"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"}

package/lib/processors/styled.js

@@ -18,18 +18,19 @@ const singleQuotedStringLiteral = value => ({
   }
 });
 
-class StyledProcessor extends _tags.BaseProcessor {
+class StyledProcessor extends _tags.TaggedTemplateProcessor {
   #variableIdx = 0;
   #variablesCache = new Map();
 
-  constructor(...args) {
-    var _this$params$;
-
-    super(...args);
+  constructor(params, ...args) {
+    (0, _tags.validateParams)(params, ['tag', ['call', 'member'], 'template'], 'Invalid usage of `styled` tag');
+    const [tag, tagOp, template] = params;
+    super([tag, template], ...args);
     let component;
-    const [type, value, ...rest] = (_this$params$ = this.params[0]) !== null && _this$params$ !== void 0 ? _this$params$ : [];
 
-    if (type === 'call' && rest.length === 0) {
+    if (tagOp[0] === 'call' && tagOp.length === 2) {
+      const value = tagOp[1];
+
       if (value.kind === _tags.ValueType.FUNCTION) {
         component = 'FunctionalComponent';
       } else {
@@ -41,11 +42,11 @@ class StyledProcessor extends _tags.BaseProcessor {
       }
     }
 
-    if (type === 'member') {
-      component = value;
+    if (tagOp[0] === 'member') {
+      [, component] = tagOp;
     }
 
-    if (!component || this.params.length > 1) {
+    if (!component) {
       throw new Error('Invalid usage of `styled` tag');
     }
 
@@ -117,7 +118,7 @@ class StyledProcessor extends _tags.BaseProcessor {
 
   get tagExpression() {
     const t = this.astService;
-    return t.callExpression(this.tagExp, [this.tagExpressionArgument]);
+    return t.callExpression(this.tag, [this.tagExpressionArgument]);
   }
 
   get value() {
@@ -126,6 +127,20 @@ class StyledProcessor extends _tags.BaseProcessor {
     return t.objectExpression([t.objectProperty(t.stringLiteral('displayName'), t.stringLiteral(this.displayName)), t.objectProperty(t.stringLiteral('__linaria'), t.objectExpression([t.objectProperty(t.stringLiteral('className'), t.stringLiteral(this.className)), t.objectProperty(t.stringLiteral('extends'), extendsNode ? t.callExpression(t.identifier(extendsNode), []) : t.nullLiteral())]))]);
   }
 
+  toString() {
+    const res = arg => `${this.tagSourceCode()}(${arg})\`…\``;
+
+    if (typeof this.component === 'string') {
+      if (this.component === 'FunctionalComponent') {
+        return res('() => {…}');
+      }
+
+      return res(`'${this.component}'`);
+    }
+
+    return res(this.component.source);
+  }
+
   getProps() {
     const propsObj = {
       name: this.displayName,

package/lib/processors/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["isNotNull","x","singleQuotedStringLiteral","value","type","extra","rawValue","raw","StyledProcessor","BaseProcessor","variableIdx","variablesCache","Map","constructor","args","component","rest","params","length","kind","ValueType","FUNCTION","node","ex","source","dependencies","push","Error","addInterpolation","unit","id","getVariableId","interpolations","doEvaltimeReplacement","replacer","doRuntimeReplacement","t","astService","props","getProps","callExpression","tagExpression","getTagComponentProps","extractRules","valueCache","cssText","loc","rules","selector","className","get","name","hasMeta","__linaria","extends","displayName","start","asSelector","tagExpressionArgument","arrowFunctionExpression","blockStatement","identifier","tagExp","extendsNode","objectExpression","objectProperty","stringLiteral","nullLiteral","propsObj","class","vars","forEach","items","propExpressions","Object","entries","map","key","keyNode","booleanLiteral","propName","propValue","arrayExpression","filter","has","set","slug"],"sources":["../../src/processors/styled.ts"],"sourcesContent":["import type {\n  CallExpression,\n  Expression,\n  ObjectExpression,\n  SourceLocation,\n  StringLiteral,\n} from '@babel/types';\n\nimport { BaseProcessor, ValueType, hasMeta } from '@linaria/tags';\nimport type {\n  Rules,\n  WrappedNode,\n  ValueCache,\n  ProcessorParams,\n} from '@linaria/tags';\n\nconst isNotNull = <T>(x: T | null): x is T => x !== null;\n\nexport interface IProps {\n  atomic?: boolean;\n  class?: string;\n  name: string;\n  vars?: Record<string, Expression[]>;\n}\n\nconst singleQuotedStringLiteral = (value: string): StringLiteral => ({\n  type: 'StringLiteral',\n  value,\n  extra: {\n    rawValue: value,\n    raw: `'${value}'`,\n  },\n});\n\nexport default class StyledProcessor extends BaseProcessor {\n  public component: WrappedNode;\n\n  #variableIdx = 0;\n\n  #variablesCache = new Map<string, string>();\n\n  constructor(...args: ProcessorParams) {\n    super(...args);\n\n    let component: WrappedNode | undefined;\n    const [type, value, ...rest] = this.params[0] ?? [];\n    if (type === 'call' && rest.length === 0) {\n      if (value.kind === ValueType.FUNCTION) {\n        component = 'FunctionalComponent';\n      } else {\n        component = {\n          node: value.ex,\n          source: value.source,\n        };\n\n        this.dependencies.push(value);\n      }\n    }\n\n    if (type === 'member') {\n      component = value;\n    }\n\n    if (!component || this.params.length > 1) {\n      throw new Error('Invalid usage of `styled` tag');\n    }\n\n    this.component = component;\n  }\n\n  public override addInterpolation(\n    node: Expression,\n    source: string,\n    unit = ''\n  ): string {\n    const id = this.getVariableId(source + unit);\n\n    this.interpolations.push({\n      id,\n      node,\n      source,\n      unit,\n    });\n\n    return id;\n  }\n\n  public override doEvaltimeReplacement(): void {\n    this.replacer(this.value, false);\n  }\n\n  public override doRuntimeReplacement(): void {\n    const t = this.astService;\n\n    const props = this.getProps();\n\n    this.replacer(\n      t.callExpression(this.tagExpression, [this.getTagComponentProps(props)]),\n      true\n    );\n  }\n\n  public override extractRules(\n    valueCache: ValueCache,\n    cssText: string,\n    loc?: SourceLocation | null\n  ): Rules {\n    const rules: Rules = {};\n\n    let selector = `.${this.className}`;\n\n    // If `styled` wraps another component and not a primitive,\n    // get its class name to create a more specific selector\n    // it'll ensure that styles are overridden properly\n    let value =\n      typeof this.component === 'string'\n        ? null\n        : valueCache.get(this.component.node.name);\n    while (hasMeta(value)) {\n      selector += `.${value.__linaria.className}`;\n      value = value.__linaria.extends;\n    }\n\n    rules[selector] = {\n      cssText,\n      className: this.className,\n      displayName: this.displayName,\n      start: loc?.start ?? null,\n    };\n\n    return rules;\n  }\n\n  public override get asSelector(): string {\n    return `.${this.className}`;\n  }\n\n  protected get tagExpressionArgument(): Expression {\n    const t = this.astService;\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return t.arrowFunctionExpression([], t.blockStatement([]));\n      }\n\n      return singleQuotedStringLiteral(this.component);\n    }\n\n    return t.callExpression(t.identifier(this.component.node.name), []);\n  }\n\n  protected get tagExpression(): CallExpression {\n    const t = this.astService;\n    return t.callExpression(this.tagExp, [this.tagExpressionArgument]);\n  }\n\n  public override get value(): ObjectExpression {\n    const t = this.astService;\n    const extendsNode =\n      typeof this.component === 'string' ? null : this.component.node.name;\n\n    return t.objectExpression([\n      t.objectProperty(\n        t.stringLiteral('displayName'),\n        t.stringLiteral(this.displayName)\n      ),\n      t.objectProperty(\n        t.stringLiteral('__linaria'),\n        t.objectExpression([\n          t.objectProperty(\n            t.stringLiteral('className'),\n            t.stringLiteral(this.className)\n          ),\n          t.objectProperty(\n            t.stringLiteral('extends'),\n            extendsNode\n              ? t.callExpression(t.identifier(extendsNode), [])\n              : t.nullLiteral()\n          ),\n        ])\n      ),\n    ]);\n  }\n\n  protected getProps(): IProps {\n    const propsObj: IProps = {\n      name: this.displayName,\n      class: this.className,\n    };\n\n    // If we found any interpolations, also pass them, so they can be applied\n    if (this.interpolations.length) {\n      propsObj.vars = {};\n      this.interpolations.forEach(({ id, unit, node }) => {\n        const items: Expression[] = [this.astService.callExpression(node, [])];\n\n        if (unit) {\n          items.push(this.astService.stringLiteral(unit));\n        }\n\n        propsObj.vars![id] = items;\n      });\n    }\n\n    return propsObj;\n  }\n\n  protected getTagComponentProps(props: IProps): ObjectExpression {\n    const t = this.astService;\n\n    const propExpressions = Object.entries(props)\n      .map(([key, value]: [key: string, value: IProps[keyof IProps]]) => {\n        if (!value) {\n          return null;\n        }\n\n        const keyNode = t.identifier(key);\n\n        if (typeof value === 'string') {\n          return t.objectProperty(keyNode, t.stringLiteral(value));\n        }\n\n        if (typeof value === 'boolean') {\n          return t.objectProperty(keyNode, t.booleanLiteral(value));\n        }\n\n        const vars = Object.entries(value).map(([propName, propValue]) => {\n          return t.objectProperty(\n            t.stringLiteral(propName),\n            t.arrayExpression(propValue)\n          );\n        });\n\n        return t.objectProperty(keyNode, t.objectExpression(vars));\n      })\n      .filter(isNotNull);\n\n    return t.objectExpression(propExpressions);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  protected getVariableId(value: string): string {\n    if (!this.#variablesCache.has(value)) {\n      // make the variable unique to this styled component\n      // eslint-disable-next-line no-plusplus\n      this.#variablesCache.set(value, `${this.slug}-${this.#variableIdx++}`);\n    }\n\n    return this.#variablesCache.get(value)!;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["isNotNull","x","singleQuotedStringLiteral","value","type","extra","rawValue","raw","StyledProcessor","TaggedTemplateProcessor","variableIdx","variablesCache","Map","constructor","params","args","validateParams","tag","tagOp","template","component","length","kind","ValueType","FUNCTION","node","ex","source","dependencies","push","Error","addInterpolation","unit","id","getVariableId","interpolations","doEvaltimeReplacement","replacer","doRuntimeReplacement","t","astService","props","getProps","callExpression","tagExpression","getTagComponentProps","extractRules","valueCache","cssText","loc","rules","selector","className","get","name","hasMeta","__linaria","extends","displayName","start","asSelector","tagExpressionArgument","arrowFunctionExpression","blockStatement","identifier","extendsNode","objectExpression","objectProperty","stringLiteral","nullLiteral","toString","res","arg","tagSourceCode","propsObj","class","vars","forEach","items","propExpressions","Object","entries","map","key","keyNode","booleanLiteral","propName","propValue","arrayExpression","filter","has","set","slug"],"sources":["../../src/processors/styled.ts"],"sourcesContent":["import type {\n  CallExpression,\n  Expression,\n  ObjectExpression,\n  SourceLocation,\n  StringLiteral,\n} from '@babel/types';\n\nimport type {\n  Rules,\n  WrappedNode,\n  ValueCache,\n  Params,\n  TailProcessorParams,\n} from '@linaria/tags';\nimport {\n  TaggedTemplateProcessor,\n  ValueType,\n  hasMeta,\n  validateParams,\n} from '@linaria/tags';\n\nconst isNotNull = <T>(x: T | null): x is T => x !== null;\n\nexport interface IProps {\n  atomic?: boolean;\n  class?: string;\n  name: string;\n  vars?: Record<string, Expression[]>;\n}\n\nconst singleQuotedStringLiteral = (value: string): StringLiteral => ({\n  type: 'StringLiteral',\n  value,\n  extra: {\n    rawValue: value,\n    raw: `'${value}'`,\n  },\n});\n\nexport default class StyledProcessor extends TaggedTemplateProcessor {\n  public component: WrappedNode;\n\n  #variableIdx = 0;\n\n  #variablesCache = new Map<string, string>();\n\n  constructor(params: Params, ...args: TailProcessorParams) {\n    validateParams(\n      params,\n      ['tag', ['call', 'member'], 'template'],\n      'Invalid usage of `styled` tag'\n    );\n\n    const [tag, tagOp, template] = params;\n\n    super([tag, template], ...args);\n\n    let component: WrappedNode | undefined;\n    if (tagOp[0] === 'call' && tagOp.length === 2) {\n      const value = tagOp[1];\n      if (value.kind === ValueType.FUNCTION) {\n        component = 'FunctionalComponent';\n      } else {\n        component = {\n          node: value.ex,\n          source: value.source,\n        };\n\n        this.dependencies.push(value);\n      }\n    }\n\n    if (tagOp[0] === 'member') {\n      [, component] = tagOp;\n    }\n\n    if (!component) {\n      throw new Error('Invalid usage of `styled` tag');\n    }\n\n    this.component = component;\n  }\n\n  public override addInterpolation(\n    node: Expression,\n    source: string,\n    unit = ''\n  ): string {\n    const id = this.getVariableId(source + unit);\n\n    this.interpolations.push({\n      id,\n      node,\n      source,\n      unit,\n    });\n\n    return id;\n  }\n\n  public override doEvaltimeReplacement(): void {\n    this.replacer(this.value, false);\n  }\n\n  public override doRuntimeReplacement(): void {\n    const t = this.astService;\n\n    const props = this.getProps();\n\n    this.replacer(\n      t.callExpression(this.tagExpression, [this.getTagComponentProps(props)]),\n      true\n    );\n  }\n\n  public override extractRules(\n    valueCache: ValueCache,\n    cssText: string,\n    loc?: SourceLocation | null\n  ): Rules {\n    const rules: Rules = {};\n\n    let selector = `.${this.className}`;\n\n    // If `styled` wraps another component and not a primitive,\n    // get its class name to create a more specific selector\n    // it'll ensure that styles are overridden properly\n    let value =\n      typeof this.component === 'string'\n        ? null\n        : valueCache.get(this.component.node.name);\n    while (hasMeta(value)) {\n      selector += `.${value.__linaria.className}`;\n      value = value.__linaria.extends;\n    }\n\n    rules[selector] = {\n      cssText,\n      className: this.className,\n      displayName: this.displayName,\n      start: loc?.start ?? null,\n    };\n\n    return rules;\n  }\n\n  public override get asSelector(): string {\n    return `.${this.className}`;\n  }\n\n  protected get tagExpressionArgument(): Expression {\n    const t = this.astService;\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return t.arrowFunctionExpression([], t.blockStatement([]));\n      }\n\n      return singleQuotedStringLiteral(this.component);\n    }\n\n    return t.callExpression(t.identifier(this.component.node.name), []);\n  }\n\n  protected get tagExpression(): CallExpression {\n    const t = this.astService;\n    return t.callExpression(this.tag, [this.tagExpressionArgument]);\n  }\n\n  public override get value(): ObjectExpression {\n    const t = this.astService;\n    const extendsNode =\n      typeof this.component === 'string' ? null : this.component.node.name;\n\n    return t.objectExpression([\n      t.objectProperty(\n        t.stringLiteral('displayName'),\n        t.stringLiteral(this.displayName)\n      ),\n      t.objectProperty(\n        t.stringLiteral('__linaria'),\n        t.objectExpression([\n          t.objectProperty(\n            t.stringLiteral('className'),\n            t.stringLiteral(this.className)\n          ),\n          t.objectProperty(\n            t.stringLiteral('extends'),\n            extendsNode\n              ? t.callExpression(t.identifier(extendsNode), [])\n              : t.nullLiteral()\n          ),\n        ])\n      ),\n    ]);\n  }\n\n  public override toString(): string {\n    const res = (arg: string) => `${this.tagSourceCode()}(${arg})\\`…\\``;\n\n    if (typeof this.component === 'string') {\n      if (this.component === 'FunctionalComponent') {\n        return res('() => {…}');\n      }\n\n      return res(`'${this.component}'`);\n    }\n\n    return res(this.component.source);\n  }\n\n  protected getProps(): IProps {\n    const propsObj: IProps = {\n      name: this.displayName,\n      class: this.className,\n    };\n\n    // If we found any interpolations, also pass them, so they can be applied\n    if (this.interpolations.length) {\n      propsObj.vars = {};\n      this.interpolations.forEach(({ id, unit, node }) => {\n        const items: Expression[] = [this.astService.callExpression(node, [])];\n\n        if (unit) {\n          items.push(this.astService.stringLiteral(unit));\n        }\n\n        propsObj.vars![id] = items;\n      });\n    }\n\n    return propsObj;\n  }\n\n  protected getTagComponentProps(props: IProps): ObjectExpression {\n    const t = this.astService;\n\n    const propExpressions = Object.entries(props)\n      .map(([key, value]: [key: string, value: IProps[keyof IProps]]) => {\n        if (!value) {\n          return null;\n        }\n\n        const keyNode = t.identifier(key);\n\n        if (typeof value === 'string') {\n          return t.objectProperty(keyNode, t.stringLiteral(value));\n        }\n\n        if (typeof value === 'boolean') {\n          return t.objectProperty(keyNode, t.booleanLiteral(value));\n        }\n\n        const vars = Object.entries(value).map(([propName, propValue]) => {\n          return t.objectProperty(\n            t.stringLiteral(propName),\n            t.arrayExpression(propValue)\n          );\n        });\n\n        return t.objectProperty(keyNode, t.objectExpression(vars));\n      })\n      .filter(isNotNull);\n\n    return t.objectExpression(propExpressions);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  protected getVariableId(value: string): string {\n    if (!this.#variablesCache.has(value)) {\n      // make the variable unique to this styled component\n      // eslint-disable-next-line no-plusplus\n      this.#variablesCache.set(value, `${this.slug}-${this.#variableIdx++}`);\n    }\n\n    return this.#variablesCache.get(value)!;\n  }\n}\n"],"mappings":";;;;;;;AAeA;;AAOA,MAAMA,SAAS,GAAOC,CAAJ,IAA4BA,CAAC,KAAK,IAApD;;AASA,MAAMC,yBAAyB,GAAIC,KAAD,KAAmC;EACnEC,IAAI,EAAE,eAD6D;EAEnED,KAFmE;EAGnEE,KAAK,EAAE;IACLC,QAAQ,EAAEH,KADL;IAELI,GAAG,EAAG,IAAGJ,KAAM;EAFV;AAH4D,CAAnC,CAAlC;;AASe,MAAMK,eAAN,SAA8BC,6BAA9B,CAAsD;EAGnE,CAACC,WAAD,GAAe,CAAf;EAEA,CAACC,cAAD,GAAkB,IAAIC,GAAJ,EAAlB;;EAEAC,WAAW,CAACC,MAAD,EAAiB,GAAGC,IAApB,EAA+C;IACxD,IAAAC,oBAAA,EACEF,MADF,EAEE,CAAC,KAAD,EAAQ,CAAC,MAAD,EAAS,QAAT,CAAR,EAA4B,UAA5B,CAFF,EAGE,+BAHF;IAMA,MAAM,CAACG,GAAD,EAAMC,KAAN,EAAaC,QAAb,IAAyBL,MAA/B;IAEA,MAAM,CAACG,GAAD,EAAME,QAAN,CAAN,EAAuB,GAAGJ,IAA1B;IAEA,IAAIK,SAAJ;;IACA,IAAIF,KAAK,CAAC,CAAD,CAAL,KAAa,MAAb,IAAuBA,KAAK,CAACG,MAAN,KAAiB,CAA5C,EAA+C;MAC7C,MAAMlB,KAAK,GAAGe,KAAK,CAAC,CAAD,CAAnB;;MACA,IAAIf,KAAK,CAACmB,IAAN,KAAeC,eAAA,CAAUC,QAA7B,EAAuC;QACrCJ,SAAS,GAAG,qBAAZ;MACD,CAFD,MAEO;QACLA,SAAS,GAAG;UACVK,IAAI,EAAEtB,KAAK,CAACuB,EADF;UAEVC,MAAM,EAAExB,KAAK,CAACwB;QAFJ,CAAZ;QAKA,KAAKC,YAAL,CAAkBC,IAAlB,CAAuB1B,KAAvB;MACD;IACF;;IAED,IAAIe,KAAK,CAAC,CAAD,CAAL,KAAa,QAAjB,EAA2B;MACzB,GAAGE,SAAH,IAAgBF,KAAhB;IACD;;IAED,IAAI,CAACE,SAAL,EAAgB;MACd,MAAM,IAAIU,KAAJ,CAAU,+BAAV,CAAN;IACD;;IAED,KAAKV,SAAL,GAAiBA,SAAjB;EACD;;EAEeW,gBAAgB,CAC9BN,IAD8B,EAE9BE,MAF8B,EAG9BK,IAAI,GAAG,EAHuB,EAItB;IACR,MAAMC,EAAE,GAAG,KAAKC,aAAL,CAAmBP,MAAM,GAAGK,IAA5B,CAAX;IAEA,KAAKG,cAAL,CAAoBN,IAApB,CAAyB;MACvBI,EADuB;MAEvBR,IAFuB;MAGvBE,MAHuB;MAIvBK;IAJuB,CAAzB;IAOA,OAAOC,EAAP;EACD;;EAEeG,qBAAqB,GAAS;IAC5C,KAAKC,QAAL,CAAc,KAAKlC,KAAnB,EAA0B,KAA1B;EACD;;EAEemC,oBAAoB,GAAS;IAC3C,MAAMC,CAAC,GAAG,KAAKC,UAAf;IAEA,MAAMC,KAAK,GAAG,KAAKC,QAAL,EAAd;IAEA,KAAKL,QAAL,CACEE,CAAC,CAACI,cAAF,CAAiB,KAAKC,aAAtB,EAAqC,CAAC,KAAKC,oBAAL,CAA0BJ,KAA1B,CAAD,CAArC,CADF,EAEE,IAFF;EAID;;EAEeK,YAAY,CAC1BC,UAD0B,EAE1BC,OAF0B,EAG1BC,GAH0B,EAInB;IAAA;;IACP,MAAMC,KAAY,GAAG,EAArB;IAEA,IAAIC,QAAQ,GAAI,IAAG,KAAKC,SAAU,EAAlC,CAHO,CAKP;IACA;IACA;;IACA,IAAIjD,KAAK,GACP,OAAO,KAAKiB,SAAZ,KAA0B,QAA1B,GACI,IADJ,GAEI2B,UAAU,CAACM,GAAX,CAAe,KAAKjC,SAAL,CAAeK,IAAf,CAAoB6B,IAAnC,CAHN;;IAIA,OAAO,IAAAC,aAAA,EAAQpD,KAAR,CAAP,EAAuB;MACrBgD,QAAQ,IAAK,IAAGhD,KAAK,CAACqD,SAAN,CAAgBJ,SAAU,EAA1C;MACAjD,KAAK,GAAGA,KAAK,CAACqD,SAAN,CAAgBC,OAAxB;IACD;;IAEDP,KAAK,CAACC,QAAD,CAAL,GAAkB;MAChBH,OADgB;MAEhBI,SAAS,EAAE,KAAKA,SAFA;MAGhBM,WAAW,EAAE,KAAKA,WAHF;MAIhBC,KAAK,gBAAEV,GAAF,aAAEA,GAAF,uBAAEA,GAAG,CAAEU,KAAP,mDAAgB;IAJL,CAAlB;IAOA,OAAOT,KAAP;EACD;;EAE6B,IAAVU,UAAU,GAAW;IACvC,OAAQ,IAAG,KAAKR,SAAU,EAA1B;EACD;;EAEkC,IAArBS,qBAAqB,GAAe;IAChD,MAAMtB,CAAC,GAAG,KAAKC,UAAf;;IACA,IAAI,OAAO,KAAKpB,SAAZ,KAA0B,QAA9B,EAAwC;MACtC,IAAI,KAAKA,SAAL,KAAmB,qBAAvB,EAA8C;QAC5C,OAAOmB,CAAC,CAACuB,uBAAF,CAA0B,EAA1B,EAA8BvB,CAAC,CAACwB,cAAF,CAAiB,EAAjB,CAA9B,CAAP;MACD;;MAED,OAAO7D,yBAAyB,CAAC,KAAKkB,SAAN,CAAhC;IACD;;IAED,OAAOmB,CAAC,CAACI,cAAF,CAAiBJ,CAAC,CAACyB,UAAF,CAAa,KAAK5C,SAAL,CAAeK,IAAf,CAAoB6B,IAAjC,CAAjB,EAAyD,EAAzD,CAAP;EACD;;EAE0B,IAAbV,aAAa,GAAmB;IAC5C,MAAML,CAAC,GAAG,KAAKC,UAAf;IACA,OAAOD,CAAC,CAACI,cAAF,CAAiB,KAAK1B,GAAtB,EAA2B,CAAC,KAAK4C,qBAAN,CAA3B,CAAP;EACD;;EAEwB,IAAL1D,KAAK,GAAqB;IAC5C,MAAMoC,CAAC,GAAG,KAAKC,UAAf;IACA,MAAMyB,WAAW,GACf,OAAO,KAAK7C,SAAZ,KAA0B,QAA1B,GAAqC,IAArC,GAA4C,KAAKA,SAAL,CAAeK,IAAf,CAAoB6B,IADlE;IAGA,OAAOf,CAAC,CAAC2B,gBAAF,CAAmB,CACxB3B,CAAC,CAAC4B,cAAF,CACE5B,CAAC,CAAC6B,aAAF,CAAgB,aAAhB,CADF,EAEE7B,CAAC,CAAC6B,aAAF,CAAgB,KAAKV,WAArB,CAFF,CADwB,EAKxBnB,CAAC,CAAC4B,cAAF,CACE5B,CAAC,CAAC6B,aAAF,CAAgB,WAAhB,CADF,EAEE7B,CAAC,CAAC2B,gBAAF,CAAmB,CACjB3B,CAAC,CAAC4B,cAAF,CACE5B,CAAC,CAAC6B,aAAF,CAAgB,WAAhB,CADF,EAEE7B,CAAC,CAAC6B,aAAF,CAAgB,KAAKhB,SAArB,CAFF,CADiB,EAKjBb,CAAC,CAAC4B,cAAF,CACE5B,CAAC,CAAC6B,aAAF,CAAgB,SAAhB,CADF,EAEEH,WAAW,GACP1B,CAAC,CAACI,cAAF,CAAiBJ,CAAC,CAACyB,UAAF,CAAaC,WAAb,CAAjB,EAA4C,EAA5C,CADO,GAEP1B,CAAC,CAAC8B,WAAF,EAJN,CALiB,CAAnB,CAFF,CALwB,CAAnB,CAAP;EAqBD;;EAEeC,QAAQ,GAAW;IACjC,MAAMC,GAAG,GAAIC,GAAD,IAAkB,GAAE,KAAKC,aAAL,EAAqB,IAAGD,GAAI,QAA5D;;IAEA,IAAI,OAAO,KAAKpD,SAAZ,KAA0B,QAA9B,EAAwC;MACtC,IAAI,KAAKA,SAAL,KAAmB,qBAAvB,EAA8C;QAC5C,OAAOmD,GAAG,CAAC,WAAD,CAAV;MACD;;MAED,OAAOA,GAAG,CAAE,IAAG,KAAKnD,SAAU,GAApB,CAAV;IACD;;IAED,OAAOmD,GAAG,CAAC,KAAKnD,SAAL,CAAeO,MAAhB,CAAV;EACD;;EAESe,QAAQ,GAAW;IAC3B,MAAMgC,QAAgB,GAAG;MACvBpB,IAAI,EAAE,KAAKI,WADY;MAEvBiB,KAAK,EAAE,KAAKvB;IAFW,CAAzB,CAD2B,CAM3B;;IACA,IAAI,KAAKjB,cAAL,CAAoBd,MAAxB,EAAgC;MAC9BqD,QAAQ,CAACE,IAAT,GAAgB,EAAhB;MACA,KAAKzC,cAAL,CAAoB0C,OAApB,CAA4B,CAAC;QAAE5C,EAAF;QAAMD,IAAN;QAAYP;MAAZ,CAAD,KAAwB;QAClD,MAAMqD,KAAmB,GAAG,CAAC,KAAKtC,UAAL,CAAgBG,cAAhB,CAA+BlB,IAA/B,EAAqC,EAArC,CAAD,CAA5B;;QAEA,IAAIO,IAAJ,EAAU;UACR8C,KAAK,CAACjD,IAAN,CAAW,KAAKW,UAAL,CAAgB4B,aAAhB,CAA8BpC,IAA9B,CAAX;QACD;;QAED0C,QAAQ,CAACE,IAAT,CAAe3C,EAAf,IAAqB6C,KAArB;MACD,CARD;IASD;;IAED,OAAOJ,QAAP;EACD;;EAES7B,oBAAoB,CAACJ,KAAD,EAAkC;IAC9D,MAAMF,CAAC,GAAG,KAAKC,UAAf;IAEA,MAAMuC,eAAe,GAAGC,MAAM,CAACC,OAAP,CAAexC,KAAf,EACrByC,GADqB,CACjB,CAAC,CAACC,GAAD,EAAMhF,KAAN,CAAD,KAA8D;MACjE,IAAI,CAACA,KAAL,EAAY;QACV,OAAO,IAAP;MACD;;MAED,MAAMiF,OAAO,GAAG7C,CAAC,CAACyB,UAAF,CAAamB,GAAb,CAAhB;;MAEA,IAAI,OAAOhF,KAAP,KAAiB,QAArB,EAA+B;QAC7B,OAAOoC,CAAC,CAAC4B,cAAF,CAAiBiB,OAAjB,EAA0B7C,CAAC,CAAC6B,aAAF,CAAgBjE,KAAhB,CAA1B,CAAP;MACD;;MAED,IAAI,OAAOA,KAAP,KAAiB,SAArB,EAAgC;QAC9B,OAAOoC,CAAC,CAAC4B,cAAF,CAAiBiB,OAAjB,EAA0B7C,CAAC,CAAC8C,cAAF,CAAiBlF,KAAjB,CAA1B,CAAP;MACD;;MAED,MAAMyE,IAAI,GAAGI,MAAM,CAACC,OAAP,CAAe9E,KAAf,EAAsB+E,GAAtB,CAA0B,CAAC,CAACI,QAAD,EAAWC,SAAX,CAAD,KAA2B;QAChE,OAAOhD,CAAC,CAAC4B,cAAF,CACL5B,CAAC,CAAC6B,aAAF,CAAgBkB,QAAhB,CADK,EAEL/C,CAAC,CAACiD,eAAF,CAAkBD,SAAlB,CAFK,CAAP;MAID,CALY,CAAb;MAOA,OAAOhD,CAAC,CAAC4B,cAAF,CAAiBiB,OAAjB,EAA0B7C,CAAC,CAAC2B,gBAAF,CAAmBU,IAAnB,CAA1B,CAAP;IACD,CAxBqB,EAyBrBa,MAzBqB,CAyBdzF,SAzBc,CAAxB;IA2BA,OAAOuC,CAAC,CAAC2B,gBAAF,CAAmBa,eAAnB,CAAP;EACD,CAjOkE,CAmOnE;;;EACU7C,aAAa,CAAC/B,KAAD,EAAwB;IAC7C,IAAI,CAAC,KAAK,CAACQ,cAAN,CAAqB+E,GAArB,CAAyBvF,KAAzB,CAAL,EAAsC;MACpC;MACA;MACA,KAAK,CAACQ,cAAN,CAAqBgF,GAArB,CAAyBxF,KAAzB,EAAiC,GAAE,KAAKyF,IAAK,IAAG,KAAK,CAAClF,WAAN,EAAoB,EAApE;IACD;;IAED,OAAO,KAAK,CAACC,cAAN,CAAqB0C,GAArB,CAAyBlD,KAAzB,CAAP;EACD;;AA5OkE"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@linaria/react",
   "description": "Blazing fast zero-runtime CSS in JS library",
-  "version": "4.0.0-beta.1",
+  "version": "4.0.0",
   "bugs": "https://github.com/callstack/linaria/issues",
   "dependencies": {
     "@emotion/is-prop-valid": "^0.8.8",
-    "@linaria/core": "^4.0.0-beta.1",
-    "@linaria/tags": "^4.0.0-beta.1",
+    "@linaria/core": "^4.0.0",
+    "@linaria/tags": "^4.0.0",
     "ts-invariant": "^0.10.3"
   },
   "devDependencies": {

package/types/processors/styled.d.ts

@@ -1,16 +1,16 @@
 import type { CallExpression, Expression, ObjectExpression, SourceLocation } from '@babel/types';
-import { BaseProcessor } from '@linaria/tags';
-import type { Rules, WrappedNode, ValueCache, ProcessorParams } from '@linaria/tags';
+import type { Rules, WrappedNode, ValueCache, Params, TailProcessorParams } from '@linaria/tags';
+import { TaggedTemplateProcessor } from '@linaria/tags';
 export interface IProps {
     atomic?: boolean;
     class?: string;
     name: string;
     vars?: Record<string, Expression[]>;
 }
-export default class StyledProcessor extends BaseProcessor {
+export default class StyledProcessor extends TaggedTemplateProcessor {
     #private;
     component: WrappedNode;
-    constructor(...args: ProcessorParams);
+    constructor(params: Params, ...args: TailProcessorParams);
     addInterpolation(node: Expression, source: string, unit?: string): string;
     doEvaltimeReplacement(): void;
     doRuntimeReplacement(): void;
@@ -19,6 +19,7 @@ export default class StyledProcessor extends BaseProcessor {
     protected get tagExpressionArgument(): Expression;
     protected get tagExpression(): CallExpression;
     get value(): ObjectExpression;
+    toString(): string;
     protected getProps(): IProps;
     protected getTagComponentProps(props: IProps): ObjectExpression;
     protected getVariableId(value: string): string;