Big News: Socket raises $60M Series C at a $1B valuation to secure software supply chains for AI-driven development.Announcement →
Sign In

@linaria/react

Package Overview
Dependencies
Maintainers
4
Versions
53
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@linaria/react - npm Package Compare versions

Comparing version
4.3.0
 to
4.3.1
+1
-1
dist/index.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/index.ts","../src/styled.ts"],"sourcesContent":["export { default as styled } from './styled';\nexport type { StyledJSXIntrinsics, Styled } from './styled';\nexport type { CSSProperties } from '@linaria/core';\nexport type { StyledMeta } from '@linaria/tags';\n","/* 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 } from '@linaria/core';\nimport type { StyledMeta } from '@linaria/tags';\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 atomic?: boolean;\n class: string;\n name: string;\n propsAsIs: 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 asIs: boolean,\n props: T,\n omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n if (!asIs) {\n /**\n * A failsafe check for esModule import issues\n * if validAttr !== 'function' then it is an object of { default: Fn }\n */\n const interopValidAttr =\n typeof validAttr === 'function' ? { default: validAttr } : validAttr;\n\n Object.keys(filteredProps).forEach((key) => {\n if (!interopValidAttr.default(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 shouldKeepProps =\n options.propsAsIs === undefined\n ? !(\n typeof component === 'string' &&\n component.indexOf('-') === -1 &&\n !isCapital(component[0])\n )\n : options.propsAsIs;\n const filteredProps: IProps = filterProps(shouldKeepProps, 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: Record<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\nexport type 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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","names":["validAttr","React"]}
{"version":3,"sources":["../src/index.ts","../src/styled.ts"],"sourcesContent":["export { default as styled } from './styled';\nexport type { StyledJSXIntrinsics, Styled } from './styled';\nexport type { CSSProperties } from '@linaria/core';\nexport type { StyledMeta } from '@linaria/tags';\n","/* 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 } from '@linaria/core';\nimport type { StyledMeta } from '@linaria/tags';\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 atomic?: boolean;\n class: string;\n name: string;\n propsAsIs: 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 asIs: boolean,\n props: T,\n omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n if (!asIs) {\n /**\n * A failsafe check for esModule import issues\n * if validAttr !== 'function' then it is an object of { default: Fn }\n */\n const interopValidAttr =\n typeof validAttr === 'function' ? { default: validAttr } : validAttr;\n\n Object.keys(filteredProps).forEach((key) => {\n if (!interopValidAttr.default(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// Components with props are not allowed\nfunction styled(\n componentWithStyle: () => any\n): (error: 'The target component should have a className prop') => void;\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 shouldKeepProps =\n options.propsAsIs === undefined\n ? !(\n typeof component === 'string' &&\n component.indexOf('-') === -1 &&\n !isCapital(component[0])\n )\n : options.propsAsIs;\n const filteredProps: IProps = filterProps(shouldKeepProps, 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: Record<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<never, 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\nexport type 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":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACOA,2BAAsB;AACtB,mBAAkB;AAElB,kBAAmB;AAyBnB,IAAM,YAAY,CAAC,OAAwB,GAAG,YAAY,MAAM;AAChE,IAAM,YACJ,CAA6B,SAC7B,CAAyB,QACvB,KAAK,QAAQ,GAAU,MAAM;AAE1B,IAAM,OAAO,CAClB,KACA,SACmB;AACnB,QAAM,MAAM,CAAC;AACb,SAAO,KAAK,GAAG,EACZ,OAAO,UAAU,IAAI,CAAC,EACtB,QAAQ,CAAC,QAAQ;AAChB,QAAI,OAAO,IAAI;AAAA,EACjB,CAAC;AAEH,SAAO;AACT;AAEA,SAAS,YACP,MACA,OACA,UACyB;AACzB,QAAM,gBAAgB,KAAK,OAAO,QAAQ;AAE1C,MAAI,CAAC,MAAM;AAKT,UAAM,mBACJ,OAAO,qBAAAA,YAAc,aAAa,EAAE,SAAS,qBAAAA,QAAU,IAAI,qBAAAA;AAE7D,WAAO,KAAK,aAAa,EAAE,QAAQ,CAAC,QAAQ;AAC1C,UAAI,CAAC,iBAAiB,QAAQ,GAAG,GAAG;AAElC,eAAO,cAAc;AAAA,MACvB;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO;AACT;AAEA,IAAM,gBAAgB,CAAC,OAAgB,kBAA0B;AAC/D,MAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,QACE,OAAO,UAAU,YAEhB,OAAO,UAAU,YAAY,SAAS,KAAK,GAC5C;AACA;AAAA,IACF;AAEA,UAAM,cACJ,OAAO,UAAU,WAAW,KAAK,UAAU,KAAK,IAAI,OAAO,KAAK;AAGlE,YAAQ;AAAA,MACN,kCAAkC,kCAAkC;AAAA,IACtE;AAAA,EACF;AACF;AAkCA,SAAS,OAAO,KAAe;AAC7B,SAAO,CAAC,YAAqB;AAC3B,QAAI,QAAQ,IAAI,aAAa,cAAc;AACzC,UAAI,MAAM,QAAQ,OAAO,GAAG;AAE1B,cAAM,IAAI;AAAA,UACR;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAEA,UAAM,SAAS,CAAC,OAAY,QAAa;AACvC,YAAM,EAAE,IAAI,YAAY,KAAK,OAAO,UAAU,IAAI;AAClD,YAAM,kBACJ,QAAQ,cAAc,SAClB,EACE,OAAO,cAAc,YACrB,UAAU,QAAQ,GAAG,MAAM,MAC3B,CAAC,UAAU,UAAU,EAAE,KAEzB,QAAQ;AACd,YAAM,gBAAwB,YAAY,iBAAiB,OAAO;AAAA,QAChE;AAAA,QACA;AAAA,MACF,CAAC;AAED,oBAAc,MAAM;AACpB,oBAAc,YAAY,QAAQ,aAC9B,gBAAG,QAAQ,OAAO,cAAc,aAAa,SAAS,QACtD,gBAAG,cAAc,aAAa,WAAW,QAAQ,KAAK;AAE1D,YAAM,EAAE,KAAK,IAAI;AAEjB,UAAI,MAAM;AACR,cAAM,QAAgC,CAAC;AAGvC,mBAAW,QAAQ,MAAM;AACvB,gBAAM,WAAW,KAAK;AACtB,gBAAM,SAAS,SAAS;AACxB,gBAAM,OAAO,SAAS,MAAM;AAC5B,gBAAM,QAAQ,OAAO,WAAW,aAAa,OAAO,KAAK,IAAI;AAE7D,wBAAc,OAAO,QAAQ,IAAI;AAEjC,gBAAM,KAAK,UAAU,GAAG,QAAQ;AAAA,QAClC;AAEA,cAAM,WAAW,cAAc,SAAS,CAAC;AACzC,cAAM,OAAO,OAAO,KAAK,QAAQ;AACjC,YAAI,KAAK,SAAS,GAAG;AACnB,eAAK,QAAQ,CAAC,QAAQ;AACpB,kBAAM,OAAO,SAAS;AAAA,UACxB,CAAC;AAAA,QACH;AAEA,sBAAc,QAAQ;AAAA,MACxB;AAEA,UAAK,IAAY,aAAa,QAAQ,WAAW;AAG/C,sBAAc,KAAK;AAEnB,eAAO,aAAAC,QAAM,cAAc,KAAK,aAAa;AAAA,MAC/C;AACA,aAAO,aAAAA,QAAM,cAAc,WAAW,aAAa;AAAA,IACrD;AAEA,UAAM,SAAS,aAAAA,QAAM,aACjB,aAAAA,QAAM,WAAW,MAAM,IAGvB,CAAC,UAAe;AACd,YAAM,OAAO,KAAK,OAAO,CAAC,UAAU,CAAC;AACrC,aAAO,OAAO,MAAM,MAAM,QAAQ;AAAA,IACpC;AAEJ,IAAC,OAAe,cAAc,QAAQ;AAGtC,IAAC,OAAe,YAAY;AAAA,MAC1B,WAAW,QAAQ;AAAA,MACnB,SAAS;AAAA,IACX;AAEA,WAAO;AAAA,EACT;AACF;AAgDA,IAAO,iBAAS,QAAQ,IAAI,aAAa,eACrC,IAAI,MAAM,QAAQ;AAAA,EAChB,IAAI,GAAG,MAAmC;AACxC,WAAO,EAAE,IAAI;AAAA,EACf;AACF,CAAC,IACD;","names":["validAttr","React"]}
+1
-1
dist/index.mjs.map

@@ -1,1 +0,1 @@

{"version":3,"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 } from '@linaria/core';\nimport type { StyledMeta } from '@linaria/tags';\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 atomic?: boolean;\n class: string;\n name: string;\n propsAsIs: 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 asIs: boolean,\n props: T,\n omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n if (!asIs) {\n /**\n * A failsafe check for esModule import issues\n * if validAttr !== 'function' then it is an object of { default: Fn }\n */\n const interopValidAttr =\n typeof validAttr === 'function' ? { default: validAttr } : validAttr;\n\n Object.keys(filteredProps).forEach((key) => {\n if (!interopValidAttr.default(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 shouldKeepProps =\n options.propsAsIs === undefined\n ? !(\n typeof component === 'string' &&\n component.indexOf('-') === -1 &&\n !isCapital(component[0])\n )\n : options.propsAsIs;\n const filteredProps: IProps = filterProps(shouldKeepProps, 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: Record<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\nexport type 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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","names":[]}
{"version":3,"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 } from '@linaria/core';\nimport type { StyledMeta } from '@linaria/tags';\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 atomic?: boolean;\n class: string;\n name: string;\n propsAsIs: 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 asIs: boolean,\n props: T,\n omitKeys: TKeys[]\n): Partial<Omit<T, TKeys>> {\n const filteredProps = omit(props, omitKeys) as Partial<T>;\n\n if (!asIs) {\n /**\n * A failsafe check for esModule import issues\n * if validAttr !== 'function' then it is an object of { default: Fn }\n */\n const interopValidAttr =\n typeof validAttr === 'function' ? { default: validAttr } : validAttr;\n\n Object.keys(filteredProps).forEach((key) => {\n if (!interopValidAttr.default(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// Components with props are not allowed\nfunction styled(\n componentWithStyle: () => any\n): (error: 'The target component should have a className prop') => void;\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 shouldKeepProps =\n options.propsAsIs === undefined\n ? !(\n typeof component === 'string' &&\n component.indexOf('-') === -1 &&\n !isCapital(component[0])\n )\n : options.propsAsIs;\n const filteredProps: IProps = filterProps(shouldKeepProps, 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: Record<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<never, 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\nexport type 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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","names":[]}
+8
-8
package.json
{
"name": "@linaria/react",
"description": "Blazing fast zero-runtime CSS in JS library",
"version": "4.3.0",
"version": "4.3.1",
"bugs": "https://github.com/callstack/linaria/issues",
"dependencies": {
"@emotion/is-prop-valid": "^1.2.0",
"@linaria/core": "^4.2.2",
"@linaria/tags": "^4.2.0",
"@linaria/utils": "^4.2.4",
"react-html-attributes": "^1.4.6",
"ts-invariant": "^0.10.3"
"ts-invariant": "^0.10.3",
"@linaria/core": "^4.2.3",
"@linaria/tags": "^4.2.1",
"@linaria/utils": "^4.2.5"
},
"devDependencies": {
"@babel/types": "^7.18.9",
"@babel/types": "^7.20.2",
"@types/babel__core": "^7.1.19",

@@ -85,3 +85,3 @@ "@types/node": "^17.0.39",

"scripts": {
"build": "npm run build:dist && npm run build:declarations",
"build": "pnpm build:dist && pnpm build:declarations",
"build:corejs-test": "cross-env NODE_ENV=legacy babel src --out-dir lib --extensions '.js,.jsx,.ts,.tsx' --ignore \"src/processors/**/*\"",

@@ -93,4 +93,4 @@ "build:declarations": "tsc --emitDeclarationOnly --outDir types",

"typecheck": "tsc --noEmit --composite false",
"watch": "npm run build --watch"
"watch": "pnpm build:dist --watch & pnpm build:declarations --watch"
}
}
+2
-1
types/styled.d.ts

@@ -10,2 +10,3 @@ import React from 'react';

export declare const omit: <T extends Record<string, unknown>, TKeys extends keyof T>(obj: T, keys: TKeys[]) => Omit<T, TKeys>;
declare function styled(componentWithStyle: () => any): (error: 'The target component should have a className prop') => void;
declare function styled<TProps extends Has<TMustHave, {

@@ -27,3 +28,3 @@ style?: React.CSSProperties;

declare type StaticPlaceholder = string | number | CSSProperties | StyledMeta;
declare type HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <TAdditionalProps = Record<string, unknown>>(strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>) => string | number)>) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;
declare type HtmlStyledTag<TName extends keyof JSX.IntrinsicElements> = <TAdditionalProps = Record<never, unknown>>(strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: JSX.IntrinsicElements[TName] & Omit<TAdditionalProps, never>) => string | number)>) => StyledComponent<JSX.IntrinsicElements[TName] & TAdditionalProps>;
declare type ComponentStyledTagWithoutInterpolation<TOrigCmp> = (strings: TemplateStringsArray, ...exprs: Array<StaticPlaceholder | ((props: 'The target component should have a style prop') => never)>) => StyledMeta & TOrigCmp;

@@ -30,0 +31,0 @@ 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>;