From 588807e98de4c106e584011c95a7fd9a24396f67 Mon Sep 17 00:00:00 2001 From: Francois Best Date: Mon, 19 Nov 2018 09:39:34 +0100 Subject: [PATCH 1/5] feat: Add basic type definitions --- package.json | 1 + src/index.d.ts | 40 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 41 insertions(+) create mode 100644 src/index.d.ts diff --git a/package.json b/package.json index 3619e6c..196157d 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "main": "dist/styled-media-query.common.js", "module": "dist/styled-media-query.es.js", "jsnext:main": "dist/styled-media-query.es.js", + "types": "./src/index.d.ts", "repository": "git@github.com:morajabi/styled-media-query.git", "keywords": [ "styled-components", diff --git a/src/index.d.ts b/src/index.d.ts new file mode 100644 index 0000000..0176b97 --- /dev/null +++ b/src/index.d.ts @@ -0,0 +1,40 @@ +// Type definitions for styled-media-query 2.0.2 + +type GeneratorFunction =

( + strings: TemplateStringsArray, + ...interpolations: (any)[] +) => any + +// -- + +export interface MediaGenerator { + lessThan: (breakpoint: keyof Breakpoints) => GeneratorFunction + greaterThan: (breakpoint: keyof Breakpoints) => GeneratorFunction + between: ( + fist: keyof Breakpoints, + second: keyof Breakpoints + ) => GeneratorFunction +} + +// -- + +export interface DefaultBreakpoints { + huge: string + large: string + medium: string + small: string +} + +export const defaultBreakpoints: DefaultBreakpoints + +// -- + +export function generateMedia( + breakpoints?: Breakpoints +): MediaGenerator + +// -- + +declare const media: MediaGenerator + +export default media From 4d017023bb62c454e13f6982550a1ca7d4017619 Mon Sep 17 00:00:00 2001 From: Francois Best Date: Wed, 21 Nov 2018 12:48:15 +0100 Subject: [PATCH 2/5] fix: Use upstream types to pass down theme & props --- src/index.d.ts | 25 +++++++++++++++++++------ 1 file changed, 19 insertions(+), 6 deletions(-) diff --git a/src/index.d.ts b/src/index.d.ts index 0176b97..f095192 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -1,19 +1,32 @@ // Type definitions for styled-media-query 2.0.2 +// Project: https://github.com/morajabi/styled-media-query +// Definitions by: François Best +// TypeScript version: 3.1.6 -type GeneratorFunction =

( +import { ThemedStyledProps, FlattenInterpolation } from 'styled-components' + +type GeneratorFunction = ( strings: TemplateStringsArray, - ...interpolations: (any)[] + ...interpolations: ( + | (( + props: ThemedStyledProps + ) => string | FlattenInterpolation>) + | FlattenInterpolation>)[] ) => any // -- export interface MediaGenerator { - lessThan: (breakpoint: keyof Breakpoints) => GeneratorFunction - greaterThan: (breakpoint: keyof Breakpoints) => GeneratorFunction - between: ( + lessThan: ( + breakpoint: keyof Breakpoints + ) => GeneratorFunction + greaterThan: ( + breakpoint: keyof Breakpoints + ) => GeneratorFunction + between: ( fist: keyof Breakpoints, second: keyof Breakpoints - ) => GeneratorFunction + ) => GeneratorFunction } // -- From 3ed4f447180c40a12af9d83f288597c733d3a7cc Mon Sep 17 00:00:00 2001 From: Francois Best Date: Wed, 21 Nov 2018 12:54:03 +0100 Subject: [PATCH 3/5] feat: Add types for convertors --- src/index.d.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/index.d.ts b/src/index.d.ts index f095192..b564bb5 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -51,3 +51,8 @@ export function generateMedia( declare const media: MediaGenerator export default media + +// Convertors -- + +export function pxToEm(breakpoints: B, ratio?: number): B +export function pxToRem(breakpoints: B, ratio?: number): B From e941fbf17ca80c245c4577b82a1b3fd27904d518 Mon Sep 17 00:00:00 2001 From: Francois Best Date: Wed, 21 Nov 2018 13:01:16 +0100 Subject: [PATCH 4/5] fix: Improve legibility, fix interpolation return type --- src/index.d.ts | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/src/index.d.ts b/src/index.d.ts index b564bb5..169217c 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -3,14 +3,20 @@ // Definitions by: François Best // TypeScript version: 3.1.6 -import { ThemedStyledProps, FlattenInterpolation } from 'styled-components' +import { + ThemedStyledProps, + InterpolationValue, + FlattenInterpolation +} from 'styled-components' + +type InterpolationFunction = ( + props: ThemedStyledProps +) => InterpolationValue | FlattenInterpolation> type GeneratorFunction = ( strings: TemplateStringsArray, ...interpolations: ( - | (( - props: ThemedStyledProps - ) => string | FlattenInterpolation>) + | InterpolationFunction | FlattenInterpolation>)[] ) => any From d29dfbd7cd10c412d346f597c433e7a367ae508e Mon Sep 17 00:00:00 2001 From: Francois Best Date: Fri, 8 Mar 2019 17:53:36 +0100 Subject: [PATCH 5/5] fix: Handle plain values as interpolations - Upgrade TypeScript version to 3.3.3 - Update styled-media-query targeted version - Indicate dependency on @types/styled-components^4.1 --- src/index.d.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/index.d.ts b/src/index.d.ts index 169217c..0ca7d1c 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -1,7 +1,8 @@ -// Type definitions for styled-media-query 2.0.2 +// Type definitions for styled-media-query 2.1.1 // Project: https://github.com/morajabi/styled-media-query // Definitions by: François Best -// TypeScript version: 3.1.6 +// Requires @types/styled-components definitions ^4.1 +// TypeScript version: 3.3.3 import { ThemedStyledProps, @@ -16,6 +17,7 @@ type InterpolationFunction = ( type GeneratorFunction = ( strings: TemplateStringsArray, ...interpolations: ( + | InterpolationValue | InterpolationFunction | FlattenInterpolation>)[] ) => any