Update react, add some V2 components for V1 usage

This commit is contained in:
DaneEveritt 2022-06-05 14:56:42 -04:00
parent 921da09a63
commit 1a5465dc34
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
21 changed files with 564 additions and 43 deletions

View file

@ -1,28 +1,29 @@
// This allows the use of css={} on JSX elements.
//
// @see https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31245
//
// This is just the contents of the @types/styled-components/cssprop.d.ts file
// since using the other method of just importing the one file did not work
// correctly for some reason.
// noinspection ES6UnusedImports
import {} from 'react';
import { ComponentType, ReactElement } from 'react';
// eslint-disable-next-line no-restricted-imports
import { CSSProp } from 'styled-components';
import styledImport, { css as cssImport, CSSProp, StyledComponentProps } from 'styled-components';
declare module 'react' {
interface Attributes {
// NOTE: unlike the plain javascript version, it is not possible to get access
// to the element's own attributes inside function interpolations.
// Only theme will be accessible, and only with the DefaultTheme due to the global
// nature of this declaration.
// If you are writing this inline you already have access to all the attributes anyway,
// no need for the extra indirection.
/**
* If present, this React element will be converted by
* `babel-plugin-styled-components` into a styled component
* with the given css as its styles.
*/
css?: CSSProp;
}
}
declare module 'styled-components' {
interface StyledComponentBase<
C extends string | ComponentType<any>,
// eslint-disable-next-line @typescript-eslint/ban-types
T extends object,
// eslint-disable-next-line @typescript-eslint/ban-types
O extends object = {},
A extends keyof any = never
> extends ForwardRefExoticBase<StyledComponentProps<C, T, O, A>> {
(props: StyledComponentProps<C, T, O, A> & { as?: Element | string; forwardedAs?: never | undefined }): ReactElement<
StyledComponentProps<C, T, O, A>
>;
}
}
declare module 'twin.macro' {
const css: typeof cssImport;
const styled: typeof styledImport;
}