diff --git a/__tests__/index.tsx b/__tests__/index.tsx index 5de92c6..28bf967 100644 --- a/__tests__/index.tsx +++ b/__tests__/index.tsx @@ -126,6 +126,49 @@ describe('Specs', () => { }); it('pickMatch', () => { + expect(pickMatch({ + mobile: false, + tablet: false, + desktop: false, + }, { + tablet: 2, + })).toBe(2); + + expect(pickMatch({ + mobile: false, + tablet: false, + desktop: false, + }, { + })).toBe(undefined); + + expect(pickMatch({ + mobile: false, + tablet: false, + desktop: false, + }, { + desktop: 3, + })).toBe(3); + + expect(pickMatch({ + mobile: false, + tablet: false, + desktop: false, + }, { + mobile: 1, + tablet: 2, + desktop: 3, + })).toBe(3); + + expect(pickMatch({ + mobile: true, + tablet: true, + desktop: true, + }, { + mobile: 1, + tablet: 2, + desktop: 3, + })).toBe(1); + expect(pickMatch({ mobile: false, tablet: true, @@ -156,7 +199,6 @@ describe('Specs', () => { })).toBe(1); }) - describe('SSR', () => { it('Render', () => { const wrapper = @@ -173,9 +215,9 @@ describe('Specs', () => { const wrapper = create( - - - + + + ); expect(wrapper.toJSON()).toEqual("2"); diff --git a/src/createMediaMatcher.tsx b/src/createMediaMatcher.tsx index 2447430..70d2bb1 100644 --- a/src/createMediaMatcher.tsx +++ b/src/createMediaMatcher.tsx @@ -19,7 +19,7 @@ const castPointsTo = (points: { [key: string]: any }, targetType: any) => ( export type NoChildren = { children?: never }; export type MediaMatcherType = { - pickMatch(matches: BoolOf, slots: Partial>): React.ReactNode | null, + pickMatch(matches: BoolOf, slots: Partial>): K, Provider: React.SFC<{ state?: MediaRulesOf, override?: false }>; Mock: React.SFC>>; @@ -40,11 +40,11 @@ export type MediaMatcherType = { export function createMediaMatcher(breakPoints: MediaRulesOf): MediaMatcherType { const MediaContext = React.createContext({}); - function pickMatch(matches: BoolOf, slots: Partial>): K | null { + function pickMatch(matches: BoolOf, slots: Partial>): K { return pickMediaMatch(breakPoints, matches, slots) } - function pickMatchEx>>(matches: BoolOf, slots: M): React.ReactNode | null { + function pickMatchEx>>(matches: BoolOf, slots: M): React.ReactNode { return pickMediaMatch(breakPoints, matches, slots) } diff --git a/src/utils.ts b/src/utils.ts index 0ef1e0e..ce67722 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -26,7 +26,7 @@ export function getMaxMatch(mediaRules: MediaRulesOf, matches: BoolOf } export function pickMediaMatch -(mediaRules: MediaRulesOf, matches: BoolOf, slots: Partial>): K | null { +(mediaRules: MediaRulesOf, matches: BoolOf, slots: Partial>): K { const keys = Object.keys(mediaRules); const len = keys.length; @@ -44,7 +44,8 @@ export function pickMediaMatch } } - return null; + // could be only possible if no slots is given, so K is undefined + return undefined as any; } export type Names = { @@ -88,4 +89,4 @@ export function notNulls(matches: { [key: string]: boolean | undefined }): { [ke return acc; }, {}) -} \ No newline at end of file +}