@linaria/react - npm Package Compare versions

Comparing version 3.0.0-beta.20 to 3.0.0-beta.21

esm/styled.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"styled.js","names":["validAttr","React","cx","isCapital","ch","toUpperCase","filterKey","keys","key","indexOf","omit","obj","res","Object","filter","forEach","filterProps","component","props","omitKeys","filteredProps","warnIfInvalid","value","componentName","process","env","NODE_ENV","isFinite","stringified","JSON","stringify","String","console","warn","styled","tag","options","Array","isArray","Error","render","ref","as","class","className","atomic","vars","style","name","variable","result","unit","ownStyle","length","__linaria","createElement","Result","forwardRef","rest","innerRef","displayName","extends","Proxy","get","o","prop"],"sources":["../src/styled.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * This file contains an runtime version of `styled` component. Responsibilities of the component are:\n * - returns ReactElement based on HTML tag used with `styled` or custom React Component\n * - injects classNames for the returned component\n * - injects CSS variables used to define dynamic styles based on props\n */\nimport validAttr from '@emotion/is-prop-valid';\nimport React from 'react';\n\nimport { cx } from '@linaria/core';\nimport type { CSSProperties, StyledMeta } from '@linaria/core';\n\nexport type NoInfer<A> = [A][A extends any ? 0 : never];\n\ntype Component<TProps> =\n  | ((props: TProps) => unknown)\n  | { new (props: TProps): unknown };\n\ntype Has<T, TObj> = [T] extends [TObj] ? T : T & TObj;\n\ntype Options = {\n  name: string;\n  class: string;\n  atomic?: boolean;\n  vars?: {\n    [key: string]: [\n      string | number | ((props: unknown) => string | number),\n      string | void\n    ];\n  };\n};\n\nconst isCapital = (ch: string): boolean => ch.toUpperCase() === ch;\nconst filterKey =\n  <TExclude extends keyof any>(keys: TExclude[]) =>\n  <TAll extends keyof any>(key: TAll): key is Exclude<TAll, TExclude> =>\n    keys.indexOf(key as any) === -1;\n\nexport const omit = <T extends Record<string, unknown>, TKeys extends keyof T>(\n  obj: T,\n  keys: TKeys[]\n): Omit<T, TKeys> => {\n  const res = {} as Omit<T, TKeys>;\n  Object.keys(obj)\n    .filter(filterKey(keys))\n    .forEach((key) => {\n      res[key] = obj[key];\n    });\n\n  return res;\n};\n\nfunction filterProps<T extends Record<string, unknown>, TKeys extends keyof T>(\n  component: string | unknown,\n  props: T,\n  omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n  const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n  // Check if it's an HTML tag and not a custom element\n  if (\n    typeof component === 'string' &&\n    component.indexOf('-') === -1 &&\n    !isCapital(component[0])\n  ) {\n    Object.keys(filteredProps).forEach((key) => {\n      if (!validAttr(key)) {\n        // Don't pass through invalid attributes to HTML elements\n        delete filteredProps[key];\n      }\n    });\n  }\n\n  return filteredProps;\n}\n\nconst warnIfInvalid = (value: unknown, componentName: string) => {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      typeof value === 'string' ||\n      // eslint-disable-next-line no-self-compare,no-restricted-globals\n      (typeof value === 'number' && isFinite(value))\n    ) {\n      return;\n    }\n\n    const stringified =\n      typeof value === 'object' ? JSON.stringify(value) : String(value);\n\n    // eslint-disable-next-line no-console\n    console.warn(\n      `An interpolation evaluated to '${stringified}' in the component '${componentName}', which is probably a mistake. You should explicitly cast or transform the value to a string.`\n    );\n  }\n};\n\ninterface IProps {\n  className?: string;\n  style?: Record<string, string>;\n  [props: string]: unknown;\n}\n\n// Property-based interpolation is allowed only if `style` property exists\nfunction styled<\n  TProps extends Has<TMustHave, { style?: React.CSSProperties }>,\n  TMustHave extends { style?: React.CSSProperties },\n  TConstructor extends Component<TProps>\n>(\n  componentWithStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithInterpolation<TProps, TConstructor>;\n// If styled wraps custom component, that component should have className property\nfunction styled<\n  TProps extends Has<TMustHave, { className?: string }>,\n  TMustHave extends { className?: string },\n  TConstructor extends Component<TProps>\n>(\n  componentWithoutStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithoutInterpolation<TConstructor>;\nfunction styled<TName extends keyof JSX.IntrinsicElements>(\n  tag: TName\n): HtmlStyledTag<TName>;\nfunction styled(\n  component: 'The target component should have a className prop'\n): never;\nfunction styled(tag: any): any {\n  return (options: Options) => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (Array.isArray(options)) {\n        // We received a strings array since it's used as a tag\n        throw new Error(\n          'Using the \"styled\" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly. See https://github.com/callstack/linaria#setup'\n        );\n      }\n    }\n\n    const render = (props: any, ref: any) => {\n      const { as: component = tag, class: className } = props;\n      const filteredProps: IProps = filterProps(component, props, [\n        'as',\n        'class',\n      ]);\n\n      filteredProps.ref = ref;\n      filteredProps.className = options.atomic\n        ? cx(options.class, filteredProps.className || className)\n        : cx(filteredProps.className || className, options.class);\n\n      const { vars } = options;\n\n      if (vars) {\n        const style: { [key: string]: string } = {};\n\n        // eslint-disable-next-line guard-for-in,no-restricted-syntax\n        for (const name in vars) {\n          const variable = vars[name];\n          const result = variable[0];\n          const unit = variable[1] || '';\n          const value = typeof result === 'function' ? result(props) : result;\n\n          warnIfInvalid(value, options.name);\n\n          style[`--${name}`] = `${value}${unit}`;\n        }\n\n        const ownStyle = filteredProps.style || {};\n        const keys = Object.keys(ownStyle);\n        if (keys.length > 0) {\n          keys.forEach((key) => {\n            style[key] = ownStyle[key];\n          });\n        }\n\n        filteredProps.style = style;\n      }\n\n      if ((tag as any).__linaria && tag !== component) {\n        // If the underlying tag is a styled component, forward the `as` prop\n        // Otherwise the styles from the underlying component will be ignored\n        filteredProps.as = component;\n\n        return React.createElement(tag, filteredProps);\n      }\n      return React.createElement(component, filteredProps);\n    };\n\n    const Result = React.forwardRef\n      ? React.forwardRef(render)\n      : // React.forwardRef won't available on older React versions and in Preact\n        // Fallback to a innerRef prop in that case\n        (props: any) => {\n          const rest = omit(props, ['innerRef']);\n          return render(rest, props.innerRef);\n        };\n\n    (Result as any).displayName = options.name;\n\n    // These properties will be read by the babel plugin for interpolation\n    (Result as any).__linaria = {\n      className: options.class,\n      extends: tag,\n    };\n\n    return Result;\n  };\n}\n\ntype StyledComponent<T> = StyledMeta &\n  ([T] extends [React.FunctionComponent<any>]\n    ? T\n    : React.FunctionComponent<T & { as?: React.ElementType }>);\n\ntype StaticPlaceholder = string | number | CSSProperties | StyledMeta;\n\ntype HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <\n  TAdditionalProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((\n        // Without Omit here TS tries to infer TAdditionalProps\n        // from a component passed for interpolation\n        props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>\n      ) => string | number)\n  >\n) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;\n\ntype ComponentStyledTagWithoutInterpolation<TOrigCmp> = (\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: 'The target component should have a style prop') => never)\n  >\n) => StyledMeta & TOrigCmp;\n\ntype ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <\n  OwnProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)\n  >\n) => keyof OwnProps extends never\n  ? StyledMeta & TOrigCmp\n  : StyledComponent<OwnProps & TTrgProps>;\n\ntype StyledJSXIntrinsics = {\n  readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;\n};\n\nexport type Styled = typeof styled & StyledJSXIntrinsics;\n\nexport default (process.env.NODE_ENV !== 'production'\n  ? new Proxy(styled, {\n      get(o, prop: keyof JSX.IntrinsicElements) {\n        return o(prop);\n      },\n    })\n  : styled) as Styled;\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["validAttr","React","cx","isCapital","ch","toUpperCase","filterKey","keys","key","indexOf","omit","obj","res","Object","filter","forEach","filterProps","component","props","omitKeys","filteredProps","warnIfInvalid","value","componentName","process","env","NODE_ENV","isFinite","stringified","JSON","stringify","String","console","warn","styled","tag","options","Array","isArray","Error","render","ref","as","class","className","atomic","vars","style","name","variable","result","unit","ownStyle","length","__linaria","createElement","Result","forwardRef","rest","innerRef","displayName","extends","Proxy","get","o","prop"],"sources":["../src/styled.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * This file contains an runtime version of `styled` component. Responsibilities of the component are:\n * - returns ReactElement based on HTML tag used with `styled` or custom React Component\n * - injects classNames for the returned component\n * - injects CSS variables used to define dynamic styles based on props\n */\nimport validAttr from '@emotion/is-prop-valid';\nimport React from 'react';\n\nimport { cx } from '@linaria/core';\nimport type { CSSProperties, StyledMeta } from '@linaria/core';\n\nexport type NoInfer<A> = [A][A extends any ? 0 : never];\n\ntype Component<TProps> =\n  | ((props: TProps) => unknown)\n  | { new (props: TProps): unknown };\n\ntype Has<T, TObj> = [T] extends [TObj] ? T : T & TObj;\n\ntype Options = {\n  name: string;\n  class: string;\n  atomic?: boolean;\n  vars?: {\n    [key: string]: [\n      string | number | ((props: unknown) => string | number),\n      string | void\n    ];\n  };\n};\n\nconst isCapital = (ch: string): boolean => ch.toUpperCase() === ch;\nconst filterKey =\n  <TExclude extends keyof any>(keys: TExclude[]) =>\n  <TAll extends keyof any>(key: TAll): key is Exclude<TAll, TExclude> =>\n    keys.indexOf(key as any) === -1;\n\nexport const omit = <T extends Record<string, unknown>, TKeys extends keyof T>(\n  obj: T,\n  keys: TKeys[]\n): Omit<T, TKeys> => {\n  const res = {} as Omit<T, TKeys>;\n  Object.keys(obj)\n    .filter(filterKey(keys))\n    .forEach((key) => {\n      res[key] = obj[key];\n    });\n\n  return res;\n};\n\nfunction filterProps<T extends Record<string, unknown>, TKeys extends keyof T>(\n  component: string | unknown,\n  props: T,\n  omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n  const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n  // Check if it's an HTML tag and not a custom element\n  if (\n    typeof component === 'string' &&\n    component.indexOf('-') === -1 &&\n    !isCapital(component[0])\n  ) {\n    Object.keys(filteredProps).forEach((key) => {\n      if (!validAttr(key)) {\n        // Don't pass through invalid attributes to HTML elements\n        delete filteredProps[key];\n      }\n    });\n  }\n\n  return filteredProps;\n}\n\nconst warnIfInvalid = (value: unknown, componentName: string) => {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      typeof value === 'string' ||\n      // eslint-disable-next-line no-self-compare,no-restricted-globals\n      (typeof value === 'number' && isFinite(value))\n    ) {\n      return;\n    }\n\n    const stringified =\n      typeof value === 'object' ? JSON.stringify(value) : String(value);\n\n    // eslint-disable-next-line no-console\n    console.warn(\n      `An interpolation evaluated to '${stringified}' in the component '${componentName}', which is probably a mistake. You should explicitly cast or transform the value to a string.`\n    );\n  }\n};\n\ninterface IProps {\n  className?: string;\n  style?: Record<string, string>;\n  [props: string]: unknown;\n}\n\n// Property-based interpolation is allowed only if `style` property exists\nfunction styled<\n  TProps extends Has<TMustHave, { style?: React.CSSProperties }>,\n  TMustHave extends { style?: React.CSSProperties },\n  TConstructor extends Component<TProps>\n>(\n  componentWithStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithInterpolation<TProps, TConstructor>;\n// If styled wraps custom component, that component should have className property\nfunction styled<\n  TProps extends Has<TMustHave, { className?: string }>,\n  TMustHave extends { className?: string },\n  TConstructor extends Component<TProps>\n>(\n  componentWithoutStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithoutInterpolation<TConstructor>;\nfunction styled<TName extends keyof JSX.IntrinsicElements>(\n  tag: TName\n): HtmlStyledTag<TName>;\nfunction styled(\n  component: 'The target component should have a className prop'\n): never;\nfunction styled(tag: any): any {\n  return (options: Options) => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (Array.isArray(options)) {\n        // We received a strings array since it's used as a tag\n        throw new Error(\n          'Using the \"styled\" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly. See https://github.com/callstack/linaria#setup'\n        );\n      }\n    }\n\n    const render = (props: any, ref: any) => {\n      const { as: component = tag, class: className } = props;\n      const filteredProps: IProps = filterProps(component, props, [\n        'as',\n        'class',\n      ]);\n\n      filteredProps.ref = ref;\n      filteredProps.className = options.atomic\n        ? cx(options.class, filteredProps.className || className)\n        : cx(filteredProps.className || className, options.class);\n\n      const { vars } = options;\n\n      if (vars) {\n        const style: { [key: string]: string } = {};\n\n        // eslint-disable-next-line guard-for-in,no-restricted-syntax\n        for (const name in vars) {\n          const variable = vars[name];\n          const result = variable[0];\n          const unit = variable[1] || '';\n          const value = typeof result === 'function' ? result(props) : result;\n\n          warnIfInvalid(value, options.name);\n\n          style[`--${name}`] = `${value}${unit}`;\n        }\n\n        const ownStyle = filteredProps.style || {};\n        const keys = Object.keys(ownStyle);\n        if (keys.length > 0) {\n          keys.forEach((key) => {\n            style[key] = ownStyle[key];\n          });\n        }\n\n        filteredProps.style = style;\n      }\n\n      if ((tag as any).__linaria && tag !== component) {\n        // If the underlying tag is a styled component, forward the `as` prop\n        // Otherwise the styles from the underlying component will be ignored\n        filteredProps.as = component;\n\n        return React.createElement(tag, filteredProps);\n      }\n      return React.createElement(component, filteredProps);\n    };\n\n    const Result = React.forwardRef\n      ? React.forwardRef(render)\n      : // React.forwardRef won't available on older React versions and in Preact\n        // Fallback to a innerRef prop in that case\n        (props: any) => {\n          const rest = omit(props, ['innerRef']);\n          return render(rest, props.innerRef);\n        };\n\n    (Result as any).displayName = options.name;\n\n    // These properties will be read by the babel plugin for interpolation\n    (Result as any).__linaria = {\n      className: options.class,\n      extends: tag,\n    };\n\n    return Result;\n  };\n}\n\ntype StyledComponent<T> = StyledMeta &\n  ([T] extends [React.FunctionComponent<any>]\n    ? T\n    : React.FunctionComponent<T & { as?: React.ElementType }>);\n\ntype StaticPlaceholder = string | number | CSSProperties | StyledMeta;\n\ntype HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <\n  TAdditionalProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((\n        // Without Omit here TS tries to infer TAdditionalProps\n        // from a component passed for interpolation\n        props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>\n      ) => string | number)\n  >\n) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;\n\ntype ComponentStyledTagWithoutInterpolation<TOrigCmp> = (\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: 'The target component should have a style prop') => never)\n  >\n) => StyledMeta & TOrigCmp;\n\n// eslint-disable-next-line @typescript-eslint/ban-types\ntype ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <OwnProps = {}>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)\n  >\n) => keyof OwnProps extends never\n  ? StyledMeta & TOrigCmp\n  : StyledComponent<OwnProps & TTrgProps>;\n\ntype StyledJSXIntrinsics = {\n  readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;\n};\n\nexport type Styled = typeof styled & StyledJSXIntrinsics;\n\nexport default (process.env.NODE_ENV !== 'production'\n  ? new Proxy(styled, {\n      get(o, prop: keyof JSX.IntrinsicElements) {\n        return o(prop);\n      },\n    })\n  : styled) as Styled;\n"],"mappings":"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"}

lib/index.js

@@ -10,2 +10,3 @@ "use strict";
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+//# sourceMappingURL=index.js.map

lib/styled.js

@@ -142,2 +142,3 @@ "use strict";
 
-exports.default = _default;
+exports.default = _default;
+//# sourceMappingURL=styled.js.map

lib/styled.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"styled.js","names":["isCapital","ch","toUpperCase","filterKey","keys","key","indexOf","omit","obj","res","Object","filter","forEach","filterProps","component","props","omitKeys","filteredProps","validAttr","warnIfInvalid","value","componentName","process","env","NODE_ENV","isFinite","stringified","JSON","stringify","String","console","warn","styled","tag","options","Array","isArray","Error","render","ref","as","class","className","atomic","cx","vars","style","name","variable","result","unit","ownStyle","length","__linaria","React","createElement","Result","forwardRef","rest","innerRef","displayName","extends","Proxy","get","o","prop"],"sources":["../src/styled.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * This file contains an runtime version of `styled` component. Responsibilities of the component are:\n * - returns ReactElement based on HTML tag used with `styled` or custom React Component\n * - injects classNames for the returned component\n * - injects CSS variables used to define dynamic styles based on props\n */\nimport validAttr from '@emotion/is-prop-valid';\nimport React from 'react';\n\nimport { cx } from '@linaria/core';\nimport type { CSSProperties, StyledMeta } from '@linaria/core';\n\nexport type NoInfer<A> = [A][A extends any ? 0 : never];\n\ntype Component<TProps> =\n  | ((props: TProps) => unknown)\n  | { new (props: TProps): unknown };\n\ntype Has<T, TObj> = [T] extends [TObj] ? T : T & TObj;\n\ntype Options = {\n  name: string;\n  class: string;\n  atomic?: boolean;\n  vars?: {\n    [key: string]: [\n      string | number | ((props: unknown) => string | number),\n      string | void\n    ];\n  };\n};\n\nconst isCapital = (ch: string): boolean => ch.toUpperCase() === ch;\nconst filterKey =\n  <TExclude extends keyof any>(keys: TExclude[]) =>\n  <TAll extends keyof any>(key: TAll): key is Exclude<TAll, TExclude> =>\n    keys.indexOf(key as any) === -1;\n\nexport const omit = <T extends Record<string, unknown>, TKeys extends keyof T>(\n  obj: T,\n  keys: TKeys[]\n): Omit<T, TKeys> => {\n  const res = {} as Omit<T, TKeys>;\n  Object.keys(obj)\n    .filter(filterKey(keys))\n    .forEach((key) => {\n      res[key] = obj[key];\n    });\n\n  return res;\n};\n\nfunction filterProps<T extends Record<string, unknown>, TKeys extends keyof T>(\n  component: string | unknown,\n  props: T,\n  omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n  const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n  // Check if it's an HTML tag and not a custom element\n  if (\n    typeof component === 'string' &&\n    component.indexOf('-') === -1 &&\n    !isCapital(component[0])\n  ) {\n    Object.keys(filteredProps).forEach((key) => {\n      if (!validAttr(key)) {\n        // Don't pass through invalid attributes to HTML elements\n        delete filteredProps[key];\n      }\n    });\n  }\n\n  return filteredProps;\n}\n\nconst warnIfInvalid = (value: unknown, componentName: string) => {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      typeof value === 'string' ||\n      // eslint-disable-next-line no-self-compare,no-restricted-globals\n      (typeof value === 'number' && isFinite(value))\n    ) {\n      return;\n    }\n\n    const stringified =\n      typeof value === 'object' ? JSON.stringify(value) : String(value);\n\n    // eslint-disable-next-line no-console\n    console.warn(\n      `An interpolation evaluated to '${stringified}' in the component '${componentName}', which is probably a mistake. You should explicitly cast or transform the value to a string.`\n    );\n  }\n};\n\ninterface IProps {\n  className?: string;\n  style?: Record<string, string>;\n  [props: string]: unknown;\n}\n\n// Property-based interpolation is allowed only if `style` property exists\nfunction styled<\n  TProps extends Has<TMustHave, { style?: React.CSSProperties }>,\n  TMustHave extends { style?: React.CSSProperties },\n  TConstructor extends Component<TProps>\n>(\n  componentWithStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithInterpolation<TProps, TConstructor>;\n// If styled wraps custom component, that component should have className property\nfunction styled<\n  TProps extends Has<TMustHave, { className?: string }>,\n  TMustHave extends { className?: string },\n  TConstructor extends Component<TProps>\n>(\n  componentWithoutStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithoutInterpolation<TConstructor>;\nfunction styled<TName extends keyof JSX.IntrinsicElements>(\n  tag: TName\n): HtmlStyledTag<TName>;\nfunction styled(\n  component: 'The target component should have a className prop'\n): never;\nfunction styled(tag: any): any {\n  return (options: Options) => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (Array.isArray(options)) {\n        // We received a strings array since it's used as a tag\n        throw new Error(\n          'Using the \"styled\" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly. See https://github.com/callstack/linaria#setup'\n        );\n      }\n    }\n\n    const render = (props: any, ref: any) => {\n      const { as: component = tag, class: className } = props;\n      const filteredProps: IProps = filterProps(component, props, [\n        'as',\n        'class',\n      ]);\n\n      filteredProps.ref = ref;\n      filteredProps.className = options.atomic\n        ? cx(options.class, filteredProps.className || className)\n        : cx(filteredProps.className || className, options.class);\n\n      const { vars } = options;\n\n      if (vars) {\n        const style: { [key: string]: string } = {};\n\n        // eslint-disable-next-line guard-for-in,no-restricted-syntax\n        for (const name in vars) {\n          const variable = vars[name];\n          const result = variable[0];\n          const unit = variable[1] || '';\n          const value = typeof result === 'function' ? result(props) : result;\n\n          warnIfInvalid(value, options.name);\n\n          style[`--${name}`] = `${value}${unit}`;\n        }\n\n        const ownStyle = filteredProps.style || {};\n        const keys = Object.keys(ownStyle);\n        if (keys.length > 0) {\n          keys.forEach((key) => {\n            style[key] = ownStyle[key];\n          });\n        }\n\n        filteredProps.style = style;\n      }\n\n      if ((tag as any).__linaria && tag !== component) {\n        // If the underlying tag is a styled component, forward the `as` prop\n        // Otherwise the styles from the underlying component will be ignored\n        filteredProps.as = component;\n\n        return React.createElement(tag, filteredProps);\n      }\n      return React.createElement(component, filteredProps);\n    };\n\n    const Result = React.forwardRef\n      ? React.forwardRef(render)\n      : // React.forwardRef won't available on older React versions and in Preact\n        // Fallback to a innerRef prop in that case\n        (props: any) => {\n          const rest = omit(props, ['innerRef']);\n          return render(rest, props.innerRef);\n        };\n\n    (Result as any).displayName = options.name;\n\n    // These properties will be read by the babel plugin for interpolation\n    (Result as any).__linaria = {\n      className: options.class,\n      extends: tag,\n    };\n\n    return Result;\n  };\n}\n\ntype StyledComponent<T> = StyledMeta &\n  ([T] extends [React.FunctionComponent<any>]\n    ? T\n    : React.FunctionComponent<T & { as?: React.ElementType }>);\n\ntype StaticPlaceholder = string | number | CSSProperties | StyledMeta;\n\ntype HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <\n  TAdditionalProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((\n        // Without Omit here TS tries to infer TAdditionalProps\n        // from a component passed for interpolation\n        props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>\n      ) => string | number)\n  >\n) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;\n\ntype ComponentStyledTagWithoutInterpolation<TOrigCmp> = (\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: 'The target component should have a style prop') => never)\n  >\n) => StyledMeta & TOrigCmp;\n\ntype ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <\n  OwnProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)\n  >\n) => keyof OwnProps extends never\n  ? StyledMeta & TOrigCmp\n  : StyledComponent<OwnProps & TTrgProps>;\n\ntype StyledJSXIntrinsics = {\n  readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;\n};\n\nexport type Styled = typeof styled & StyledJSXIntrinsics;\n\nexport default (process.env.NODE_ENV !== 'production'\n  ? new Proxy(styled, {\n      get(o, prop: keyof JSX.IntrinsicElements) {\n        return o(prop);\n      },\n    })\n  : styled) as Styled;\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["isCapital","ch","toUpperCase","filterKey","keys","key","indexOf","omit","obj","res","Object","filter","forEach","filterProps","component","props","omitKeys","filteredProps","validAttr","warnIfInvalid","value","componentName","process","env","NODE_ENV","isFinite","stringified","JSON","stringify","String","console","warn","styled","tag","options","Array","isArray","Error","render","ref","as","class","className","atomic","cx","vars","style","name","variable","result","unit","ownStyle","length","__linaria","React","createElement","Result","forwardRef","rest","innerRef","displayName","extends","Proxy","get","o","prop"],"sources":["../src/styled.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * This file contains an runtime version of `styled` component. Responsibilities of the component are:\n * - returns ReactElement based on HTML tag used with `styled` or custom React Component\n * - injects classNames for the returned component\n * - injects CSS variables used to define dynamic styles based on props\n */\nimport validAttr from '@emotion/is-prop-valid';\nimport React from 'react';\n\nimport { cx } from '@linaria/core';\nimport type { CSSProperties, StyledMeta } from '@linaria/core';\n\nexport type NoInfer<A> = [A][A extends any ? 0 : never];\n\ntype Component<TProps> =\n  | ((props: TProps) => unknown)\n  | { new (props: TProps): unknown };\n\ntype Has<T, TObj> = [T] extends [TObj] ? T : T & TObj;\n\ntype Options = {\n  name: string;\n  class: string;\n  atomic?: boolean;\n  vars?: {\n    [key: string]: [\n      string | number | ((props: unknown) => string | number),\n      string | void\n    ];\n  };\n};\n\nconst isCapital = (ch: string): boolean => ch.toUpperCase() === ch;\nconst filterKey =\n  <TExclude extends keyof any>(keys: TExclude[]) =>\n  <TAll extends keyof any>(key: TAll): key is Exclude<TAll, TExclude> =>\n    keys.indexOf(key as any) === -1;\n\nexport const omit = <T extends Record<string, unknown>, TKeys extends keyof T>(\n  obj: T,\n  keys: TKeys[]\n): Omit<T, TKeys> => {\n  const res = {} as Omit<T, TKeys>;\n  Object.keys(obj)\n    .filter(filterKey(keys))\n    .forEach((key) => {\n      res[key] = obj[key];\n    });\n\n  return res;\n};\n\nfunction filterProps<T extends Record<string, unknown>, TKeys extends keyof T>(\n  component: string | unknown,\n  props: T,\n  omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n  const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n  // Check if it's an HTML tag and not a custom element\n  if (\n    typeof component === 'string' &&\n    component.indexOf('-') === -1 &&\n    !isCapital(component[0])\n  ) {\n    Object.keys(filteredProps).forEach((key) => {\n      if (!validAttr(key)) {\n        // Don't pass through invalid attributes to HTML elements\n        delete filteredProps[key];\n      }\n    });\n  }\n\n  return filteredProps;\n}\n\nconst warnIfInvalid = (value: unknown, componentName: string) => {\n  if (process.env.NODE_ENV !== 'production') {\n    if (\n      typeof value === 'string' ||\n      // eslint-disable-next-line no-self-compare,no-restricted-globals\n      (typeof value === 'number' && isFinite(value))\n    ) {\n      return;\n    }\n\n    const stringified =\n      typeof value === 'object' ? JSON.stringify(value) : String(value);\n\n    // eslint-disable-next-line no-console\n    console.warn(\n      `An interpolation evaluated to '${stringified}' in the component '${componentName}', which is probably a mistake. You should explicitly cast or transform the value to a string.`\n    );\n  }\n};\n\ninterface IProps {\n  className?: string;\n  style?: Record<string, string>;\n  [props: string]: unknown;\n}\n\n// Property-based interpolation is allowed only if `style` property exists\nfunction styled<\n  TProps extends Has<TMustHave, { style?: React.CSSProperties }>,\n  TMustHave extends { style?: React.CSSProperties },\n  TConstructor extends Component<TProps>\n>(\n  componentWithStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithInterpolation<TProps, TConstructor>;\n// If styled wraps custom component, that component should have className property\nfunction styled<\n  TProps extends Has<TMustHave, { className?: string }>,\n  TMustHave extends { className?: string },\n  TConstructor extends Component<TProps>\n>(\n  componentWithoutStyle: TConstructor & Component<TProps>\n): ComponentStyledTagWithoutInterpolation<TConstructor>;\nfunction styled<TName extends keyof JSX.IntrinsicElements>(\n  tag: TName\n): HtmlStyledTag<TName>;\nfunction styled(\n  component: 'The target component should have a className prop'\n): never;\nfunction styled(tag: any): any {\n  return (options: Options) => {\n    if (process.env.NODE_ENV !== 'production') {\n      if (Array.isArray(options)) {\n        // We received a strings array since it's used as a tag\n        throw new Error(\n          'Using the \"styled\" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly. See https://github.com/callstack/linaria#setup'\n        );\n      }\n    }\n\n    const render = (props: any, ref: any) => {\n      const { as: component = tag, class: className } = props;\n      const filteredProps: IProps = filterProps(component, props, [\n        'as',\n        'class',\n      ]);\n\n      filteredProps.ref = ref;\n      filteredProps.className = options.atomic\n        ? cx(options.class, filteredProps.className || className)\n        : cx(filteredProps.className || className, options.class);\n\n      const { vars } = options;\n\n      if (vars) {\n        const style: { [key: string]: string } = {};\n\n        // eslint-disable-next-line guard-for-in,no-restricted-syntax\n        for (const name in vars) {\n          const variable = vars[name];\n          const result = variable[0];\n          const unit = variable[1] || '';\n          const value = typeof result === 'function' ? result(props) : result;\n\n          warnIfInvalid(value, options.name);\n\n          style[`--${name}`] = `${value}${unit}`;\n        }\n\n        const ownStyle = filteredProps.style || {};\n        const keys = Object.keys(ownStyle);\n        if (keys.length > 0) {\n          keys.forEach((key) => {\n            style[key] = ownStyle[key];\n          });\n        }\n\n        filteredProps.style = style;\n      }\n\n      if ((tag as any).__linaria && tag !== component) {\n        // If the underlying tag is a styled component, forward the `as` prop\n        // Otherwise the styles from the underlying component will be ignored\n        filteredProps.as = component;\n\n        return React.createElement(tag, filteredProps);\n      }\n      return React.createElement(component, filteredProps);\n    };\n\n    const Result = React.forwardRef\n      ? React.forwardRef(render)\n      : // React.forwardRef won't available on older React versions and in Preact\n        // Fallback to a innerRef prop in that case\n        (props: any) => {\n          const rest = omit(props, ['innerRef']);\n          return render(rest, props.innerRef);\n        };\n\n    (Result as any).displayName = options.name;\n\n    // These properties will be read by the babel plugin for interpolation\n    (Result as any).__linaria = {\n      className: options.class,\n      extends: tag,\n    };\n\n    return Result;\n  };\n}\n\ntype StyledComponent<T> = StyledMeta &\n  ([T] extends [React.FunctionComponent<any>]\n    ? T\n    : React.FunctionComponent<T & { as?: React.ElementType }>);\n\ntype StaticPlaceholder = string | number | CSSProperties | StyledMeta;\n\ntype HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <\n  TAdditionalProps = Record<string, unknown>\n>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((\n        // Without Omit here TS tries to infer TAdditionalProps\n        // from a component passed for interpolation\n        props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>\n      ) => string | number)\n  >\n) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;\n\ntype ComponentStyledTagWithoutInterpolation<TOrigCmp> = (\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: 'The target component should have a style prop') => never)\n  >\n) => StyledMeta & TOrigCmp;\n\n// eslint-disable-next-line @typescript-eslint/ban-types\ntype ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <OwnProps = {}>(\n  strings: TemplateStringsArray,\n  ...exprs: Array<\n    | StaticPlaceholder\n    | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)\n  >\n) => keyof OwnProps extends never\n  ? StyledMeta & TOrigCmp\n  : StyledComponent<OwnProps & TTrgProps>;\n\ntype StyledJSXIntrinsics = {\n  readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;\n};\n\nexport type Styled = typeof styled & StyledJSXIntrinsics;\n\nexport default (process.env.NODE_ENV !== 'production'\n  ? new Proxy(styled, {\n      get(o, prop: keyof JSX.IntrinsicElements) {\n        return o(prop);\n      },\n    })\n  : styled) as Styled;\n"],"mappings":";;;;;AAOA;;AACA;;AAEA;;;;AAVA;;AACA;AACA;AACA;AACA;AACA;AACA;AA2BA,MAAMA,SAAS,GAAIC,EAAD,IAAyBA,EAAE,CAACC,WAAH,OAAqBD,EAAhE;;AACA,MAAME,SAAS,GACgBC,IAA7B,IACyBC,GAAzB,IACED,IAAI,CAACE,OAAL,CAAaD,GAAb,MAA6B,CAAC,CAHlC;;AAKO,MAAME,IAAI,GAAG,CAClBC,GADkB,EAElBJ,IAFkB,KAGC;EACnB,MAAMK,GAAG,GAAG,EAAZ;EACAC,MAAM,CAACN,IAAP,CAAYI,GAAZ,EACGG,MADH,CACUR,SAAS,CAACC,IAAD,CADnB,EAEGQ,OAFH,CAEYP,GAAD,IAAS;IAChBI,GAAG,CAACJ,GAAD,CAAH,GAAWG,GAAG,CAACH,GAAD,CAAd;EACD,CAJH;EAMA,OAAOI,GAAP;AACD,CAZM;;;;AAcP,SAASI,WAAT,CACEC,SADF,EAEEC,KAFF,EAGEC,QAHF,EAI2B;EACzB,MAAMC,aAAa,GAAGV,IAAI,CAACQ,KAAD,EAAQC,QAAR,CAA1B,CADyB,CAGzB;;EACA,IACE,OAAOF,SAAP,KAAqB,QAArB,IACAA,SAAS,CAACR,OAAV,CAAkB,GAAlB,MAA2B,CAAC,CAD5B,IAEA,CAACN,SAAS,CAACc,SAAS,CAAC,CAAD,CAAV,CAHZ,EAIE;IACAJ,MAAM,CAACN,IAAP,CAAYa,aAAZ,EAA2BL,OAA3B,CAAoCP,GAAD,IAAS;MAC1C,IAAI,CAAC,IAAAa,oBAAA,EAAUb,GAAV,CAAL,EAAqB;QACnB;QACA,OAAOY,aAAa,CAACZ,GAAD,CAApB;MACD;IACF,CALD;EAMD;;EAED,OAAOY,aAAP;AACD;;AAED,MAAME,aAAa,GAAG,CAACC,KAAD,EAAiBC,aAAjB,KAA2C;EAC/D,IAAIC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;IACzC,IACE,OAAOJ,KAAP,KAAiB,QAAjB,IACA;IACC,OAAOA,KAAP,KAAiB,QAAjB,IAA6BK,QAAQ,CAACL,KAAD,CAHxC,EAIE;MACA;IACD;;IAED,MAAMM,WAAW,GACf,OAAON,KAAP,KAAiB,QAAjB,GAA4BO,IAAI,CAACC,SAAL,CAAeR,KAAf,CAA5B,GAAoDS,MAAM,CAACT,KAAD,CAD5D,CATyC,CAYzC;;IACAU,OAAO,CAACC,IAAR,qCACoCL,WADpC,4BACsEL,aADtE;EAGD;AACF,CAlBD;;AAgDA,SAASW,MAAT,CAAgBC,GAAhB,EAA+B;EAC7B,OAAQC,OAAD,IAAsB;IAC3B,IAAIZ,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;MACzC,IAAIW,KAAK,CAACC,OAAN,CAAcF,OAAd,CAAJ,EAA4B;QAC1B;QACA,MAAM,IAAIG,KAAJ,CACJ,0JADI,CAAN;MAGD;IACF;;IAED,MAAMC,MAAM,GAAG,CAACvB,KAAD,EAAawB,GAAb,KAA0B;MACvC,MAAM;QAAEC,EAAE,EAAE1B,SAAS,GAAGmB,GAAlB;QAAuBQ,KAAK,EAAEC;MAA9B,IAA4C3B,KAAlD;MACA,MAAME,aAAqB,GAAGJ,WAAW,CAACC,SAAD,EAAYC,KAAZ,EAAmB,CAC1D,IAD0D,EAE1D,OAF0D,CAAnB,CAAzC;MAKAE,aAAa,CAACsB,GAAd,GAAoBA,GAApB;MACAtB,aAAa,CAACyB,SAAd,GAA0BR,OAAO,CAACS,MAAR,GACtB,IAAAC,QAAA,EAAGV,OAAO,CAACO,KAAX,EAAkBxB,aAAa,CAACyB,SAAd,IAA2BA,SAA7C,CADsB,GAEtB,IAAAE,QAAA,EAAG3B,aAAa,CAACyB,SAAd,IAA2BA,SAA9B,EAAyCR,OAAO,CAACO,KAAjD,CAFJ;MAIA,MAAM;QAAEI;MAAF,IAAWX,OAAjB;;MAEA,IAAIW,IAAJ,EAAU;QACR,MAAMC,KAAgC,GAAG,EAAzC,CADQ,CAGR;;QACA,KAAK,MAAMC,IAAX,IAAmBF,IAAnB,EAAyB;UACvB,MAAMG,QAAQ,GAAGH,IAAI,CAACE,IAAD,CAArB;UACA,MAAME,MAAM,GAAGD,QAAQ,CAAC,CAAD,CAAvB;UACA,MAAME,IAAI,GAAGF,QAAQ,CAAC,CAAD,CAAR,IAAe,EAA5B;UACA,MAAM5B,KAAK,GAAG,OAAO6B,MAAP,KAAkB,UAAlB,GAA+BA,MAAM,CAAClC,KAAD,CAArC,GAA+CkC,MAA7D;UAEA9B,aAAa,CAACC,KAAD,EAAQc,OAAO,CAACa,IAAhB,CAAb;UAEAD,KAAK,QAAMC,IAAN,CAAL,QAAwB3B,KAAxB,GAAgC8B,IAAhC;QACD;;QAED,MAAMC,QAAQ,GAAGlC,aAAa,CAAC6B,KAAd,IAAuB,EAAxC;QACA,MAAM1C,IAAI,GAAGM,MAAM,CAACN,IAAP,CAAY+C,QAAZ,CAAb;;QACA,IAAI/C,IAAI,CAACgD,MAAL,GAAc,CAAlB,EAAqB;UACnBhD,IAAI,CAACQ,OAAL,CAAcP,GAAD,IAAS;YACpByC,KAAK,CAACzC,GAAD,CAAL,GAAa8C,QAAQ,CAAC9C,GAAD,CAArB;UACD,CAFD;QAGD;;QAEDY,aAAa,CAAC6B,KAAd,GAAsBA,KAAtB;MACD;;MAED,IAAKb,GAAD,CAAaoB,SAAb,IAA0BpB,GAAG,KAAKnB,SAAtC,EAAiD;QAC/C;QACA;QACAG,aAAa,CAACuB,EAAd,GAAmB1B,SAAnB;QAEA,oBAAOwC,cAAA,CAAMC,aAAN,CAAoBtB,GAApB,EAAyBhB,aAAzB,CAAP;MACD;;MACD,oBAAOqC,cAAA,CAAMC,aAAN,CAAoBzC,SAApB,EAA+BG,aAA/B,CAAP;IACD,CAhDD;;IAkDA,MAAMuC,MAAM,GAAGF,cAAA,CAAMG,UAAN,gBACXH,cAAA,CAAMG,UAAN,CAAiBnB,MAAjB,CADW,GAEX;IACA;IACCvB,KAAD,IAAgB;MACd,MAAM2C,IAAI,GAAGnD,IAAI,CAACQ,KAAD,EAAQ,CAAC,UAAD,CAAR,CAAjB;MACA,OAAOuB,MAAM,CAACoB,IAAD,EAAO3C,KAAK,CAAC4C,QAAb,CAAb;IACD,CAPL;IASCH,MAAD,CAAgBI,WAAhB,GAA8B1B,OAAO,CAACa,IAAtC,CArE2B,CAuE3B;;IACCS,MAAD,CAAgBH,SAAhB,GAA4B;MAC1BX,SAAS,EAAER,OAAO,CAACO,KADO;MAE1BoB,OAAO,EAAE5B;IAFiB,CAA5B;IAKA,OAAOuB,MAAP;EACD,CA9ED;AA+ED;;eAgDelC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAAzB,GACZ,IAAIsC,KAAJ,CAAU9B,MAAV,EAAkB;EAChB+B,GAAG,CAACC,CAAD,EAAIC,IAAJ,EAAuC;IACxC,OAAOD,CAAC,CAACC,IAAD,CAAR;EACD;;AAHe,CAAlB,CADY,GAMZjC,M"}

package.json

 {
   "name": "@linaria/react",
   "description": "Blazing fast zero-runtime CSS in JS library",
-  "version": "3.0.0-beta.20",
+  "version": "3.0.0-beta.21",
   "bugs": "https://github.com/callstack/linaria/issues",
   "dependencies": {
     "@emotion/is-prop-valid": "^0.8.8",
-    "@linaria/core": "^3.0.0-beta.20",
+    "@linaria/core": "^3.0.0-beta.21",
     "ts-invariant": "^0.10.3"
@@ -82,3 +82,4 @@ },
     "watch": "npm run build --watch"
-  }
+  },
+  "readme": "<p align=\"center\">\n  <img alt=\"Linaria\" src=\"https://raw.githubusercontent.com/callstack/linaria/HEAD/website/assets/[e-mail]\" width=\"496\">\n</p>\n\n<p align=\"center\">\nZero-runtime CSS in JS library.\n</p>\n\n---\n\n### 📖 Please refer to the [GitHub](https://github.com/callstack/linaria#readme) for full documentation.\n\n## Features\n\n- Write CSS in JS, but with **zero runtime**, CSS is extracted to CSS files during build\n- Familiar **CSS syntax** with Sass like nesting\n- Use **dynamic prop based styles** with the React bindings, uses CSS variables behind the scenes\n- Easily find where the style was defined with **CSS sourcemaps**\n- **Lint your CSS** in JS with [stylelint](https://github.com/stylelint/stylelint)\n- Use **JavaScript for logic**, no CSS preprocessor needed\n- Optionally use any **CSS preprocessor** such as Sass or PostCSS\n\n**[Why use Linaria](../../docs/BENEFITS.md)**\n\n## Installation\n\n```sh\nnpm install @linaria/core @linaria/react @linaria/babel-preset @linaria/shaker\n```\n\nor\n\n```sh\nyarn add @linaria/core @linaria/react @linaria/babel-preset @linaria/shaker\n```\n"
 }

types/styled.d.ts

@@ -27,3 +27,3 @@ import React from 'react';
 declare type ComponentStyledTagWithoutInterpolation<TOrigCmp> = (strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: 'The target component should have a style prop') => never)>) => StyledMeta & TOrigCmp;
-declare type ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <OwnProps = Record<string, unknown>>(strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)>) => keyof OwnProps extends never ? StyledMeta & TOrigCmp : StyledComponent<OwnProps & TTrgProps>;
+declare type ComponentStyledTagWithInterpolation<TTrgProps, TOrigCmp> = <OwnProps = {}>(strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: NoInfer<OwnProps & TTrgProps>) => string | number)>) => keyof OwnProps extends never ? StyledMeta & TOrigCmp : StyledComponent<OwnProps & TTrgProps>;
 declare type StyledJSXIntrinsics = {
@@ -30,0 +30,0 @@ readonly [P in keyof JSX.IntrinsicElements]: HtmlStyledTag<P>;

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

81867

1.57%

Lines of code

608

0.33%

Dependency changes

• Updated

  @linaria/core@^3.0.0-beta.21