flip/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/FlipsideCrypto/DefinitelyTyped.git synced 2026-02-06 10:56:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[styled-system] Make N a generic on style and add typedef for scale (#35556)

Browse Source 
* Add generic for N and typedef for scale

* Make style scale generic with a default
This commit is contained in:
Dhalton 2019-05-21 02:49:29 -07:00 committed by Eloy Durán
parent 4550017146
commit 19639a0aaf
2 changed files with 30 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
types/styled-system/index.d.ts vendored
View File

@ -36,17 +36,20 @@ export interface styleFn {
propTypes?: string[];
}
export interface LowLevelStylefunctionArguments {
prop: string;
cssProperty?: string;
alias?: string;
key?: string;
transformValue?: (n: string | number, scale: Array<string | number>) => any;
scale?: Array<string | number>;
export type Scale = object | Array<string | number>;
export interface LowLevelStylefunctionArguments<N, S> {
prop: string;
cssProperty?: string;
alias?: string;
key?: string;
transformValue?: (n: N, scale?: S) => any;
scale?: S;
}
export function style(
args: LowLevelStylefunctionArguments
export function style<N = string | number, S = Scale>(
// tslint:disable-next-line no-unnecessary-generics
args: LowLevelStylefunctionArguments<N, S>
): { [cssProp: string]: string };
export function compose(

18
types/styled-system/styled-system-tests.tsx
View File

@ -694,6 +694,24 @@ const customFontSize = style({
scale: [8, 16, 32]
});
const centerWithGenerics = style<boolean>({
prop: 'center',
cssProperty: 'justify-content',
transformValue: shouldCenter => shouldCenter ? 'center' : 'flex-start'
});
const buttonSizes = {
sm: '8px',
md: '12px',
lg: '24px',
};
const buttonSizeWithGeneric = style<keyof typeof buttonSizes, typeof buttonSizes>({
prop: 'size',
cssProperty: 'font-size',
transformValue: (size, sizes) => sizes && sizes[size]
});
// All Style Functions contain `propTypes`
export const alignContentPropTypes = alignContent.propTypes;
export const alignItemsPropTypes = alignItems.propTypes;