From 55c8cfe71884b063320ef98e875d39c875958473 Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Mon, 10 Dec 2018 14:58:38 -0800 Subject: [PATCH 1/6] Update select typings to 4.0 --- types/storybook__addon-knobs/index.d.ts | 14 +++++--------- .../storybook__addon-knobs-tests.tsx | 8 ++------ 2 files changed, 7 insertions(+), 15 deletions(-) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index 8c3ddc35f8..f8ff505268 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -1,10 +1,11 @@ -// Type definitions for @storybook/addon-knobs 3.4 +// Type definitions for @storybook/addon-knobs 4.0 // Project: https://github.com/storybooks/storybook // Definitions by: Joscha Feth // Martynas Kadisa // A.MacLeay +// Michael Loughry // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped -// TypeScript Version: 2.8 +// TypeScript Version: 3.2.1 import * as React from 'react'; import { RenderFunction } from '@storybook/react'; @@ -47,13 +48,8 @@ export function color(name: string, value: string, groupId?: string): string; export function object(name: string, value: T, groupId?: string): T; -export type SelectValue = string | number; -export function select(name: string, options: { [s: string]: string }, value: T, groupId?: string): T; -export function select(name: string, options: { [s: number]: string }, value: T, groupId?: string): T; -export function select(name: string, options: ReadonlyArray, value: T, groupId?: string): T; - -export function selectV2(name: string, options: { [s: string]: T | T[] }, value: T | T[], groupId?: string): T; -export function selectV2(name: string, options: T[], value: T, groupId?: string): T; +export type SelectValue = string | number | ReadonlyArray | ReadonlyArray; +export function select(name: string, options: { [s: string]: T } | ReadonlyArray, value: T, groupId?: string): T; export function date(name: string, value?: Date, groupId?: string): Date; diff --git a/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx b/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx index 85155fc5c7..73454ce8b3 100644 --- a/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx +++ b/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx @@ -14,7 +14,6 @@ import { array, button, knob, - selectV2, } from '@storybook/addon-knobs'; enum SomeEnum { @@ -50,15 +49,12 @@ stories.add('with all knobs', () => { type X = 'a' | 'b'; - const genericSelect: X = select('Some generic select', { a: 'type a', b: 'type b' }, 'b'); - const enumSelectOptions: { [s: number]: string } = {}; enumSelectOptions[SomeEnum.Type1] = "Type 1"; enumSelectOptions[SomeEnum.Type2] = "Type 2"; - const genericSelect2: SomeEnum = select('Some generic select', enumSelectOptions, SomeEnum.Type1); - const genericSelectV2: X = selectV2('Some generic select', { 'type a': 'a', 'type b': 'b' }, 'b'); - const genericSelectV2Enum: SomeEnum = selectV2('Some generic select v2', { 'type a': SomeEnum.Type1, 'type b': SomeEnum.Type2 }, SomeEnum.Type2); + const genericSelectV2: X = select('Some generic select', { 'type a': 'a', 'type b': 'b' }, 'b'); + const genericSelectV2Enum: SomeEnum = select('Some generic select v2', { 'type a': SomeEnum.Type1, 'type b': SomeEnum.Type2 }, SomeEnum.Type2); const genericArray: string[] = array('Some generic array', ['red', 'green', 'blue']); From f7cb9c9f7195b64b15f87236b62f013a1425e5f0 Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Mon, 10 Dec 2018 15:10:57 -0800 Subject: [PATCH 2/6] Remove broken header line --- types/storybook__addon-knobs/index.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index f8ff505268..9cebc3c661 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -5,7 +5,6 @@ // A.MacLeay // Michael Loughry // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped -// TypeScript Version: 3.2.1 import * as React from 'react'; import { RenderFunction } from '@storybook/react'; From a046e84a1d047f35b8487881051f201f5303ca2e Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Mon, 10 Dec 2018 15:54:16 -0800 Subject: [PATCH 3/6] Can't figure out how to specify higher TS version --- types/storybook__addon-knobs/index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index 9cebc3c661..0c3ec42c6f 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -5,6 +5,7 @@ // A.MacLeay // Michael Loughry // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 3.0 import * as React from 'react'; import { RenderFunction } from '@storybook/react'; From 9688de0a5313609246e23d02e846580ae492a3e8 Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Tue, 11 Dec 2018 10:59:25 -0800 Subject: [PATCH 4/6] Fix the typings so you can't pass in T[][] for options --- types/storybook__addon-knobs/index.d.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index 0c3ec42c6f..9d72602daf 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -48,8 +48,9 @@ export function color(name: string, value: string, groupId?: string): string; export function object(name: string, value: T, groupId?: string): T; -export type SelectValue = string | number | ReadonlyArray | ReadonlyArray; -export function select(name: string, options: { [s: string]: T } | ReadonlyArray, value: T, groupId?: string): T; +export type SelectValue = string | number; +export function select(name: string, options: { [s: string]: T | ReadonlyArray }, value: T | ReadonlyArray, groupId?: string): T | T[]; +export function select(name: string, options: ReadonlyArray, value: T, groupId?: string): T; export function date(name: string, value?: Date, groupId?: string): Date; From ba8599697fb191904ee36a6dcb17ba1cc02fc16e Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Tue, 11 Dec 2018 11:53:04 -0800 Subject: [PATCH 5/6] Better return typing to reduce need for type-casting --- types/storybook__addon-knobs/index.d.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index 9d72602daf..ddb2ce1b64 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -49,6 +49,8 @@ export function color(name: string, value: string, groupId?: string): string; export function object(name: string, value: T, groupId?: string): T; export type SelectValue = string | number; +export function select(name: string, options: { [s: string]: T }, value: T | ReadonlyArray, groupId?: string): T; +export function select(name: string, options: { [s: string]: ReadonlyArray }, value: T | ReadonlyArray, groupId?: string): T[]; export function select(name: string, options: { [s: string]: T | ReadonlyArray }, value: T | ReadonlyArray, groupId?: string): T | T[]; export function select(name: string, options: ReadonlyArray, value: T, groupId?: string): T; From ab1b6a4468642f371fd3e259dbd23e1d6e855817 Mon Sep 17 00:00:00 2001 From: OWA Framework Date: Tue, 11 Dec 2018 13:07:51 -0800 Subject: [PATCH 6/6] Fix test failure --- types/storybook__addon-knobs/index.d.ts | 2 +- .../storybook__addon-knobs/storybook__addon-knobs-tests.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/types/storybook__addon-knobs/index.d.ts b/types/storybook__addon-knobs/index.d.ts index ddb2ce1b64..38dd45abce 100644 --- a/types/storybook__addon-knobs/index.d.ts +++ b/types/storybook__addon-knobs/index.d.ts @@ -50,7 +50,7 @@ export function object(name: string, value: T, groupId?: string): T; export type SelectValue = string | number; export function select(name: string, options: { [s: string]: T }, value: T | ReadonlyArray, groupId?: string): T; -export function select(name: string, options: { [s: string]: ReadonlyArray }, value: T | ReadonlyArray, groupId?: string): T[]; +export function select(name: string, options: { [s: string]: ReadonlyArray }, value: ReadonlyArray, groupId?: string): T[]; export function select(name: string, options: { [s: string]: T | ReadonlyArray }, value: T | ReadonlyArray, groupId?: string): T | T[]; export function select(name: string, options: ReadonlyArray, value: T, groupId?: string): T; diff --git a/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx b/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx index 73454ce8b3..97daf9853d 100644 --- a/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx +++ b/types/storybook__addon-knobs/storybook__addon-knobs-tests.tsx @@ -35,9 +35,9 @@ stories.add('with all knobs', () => { const favoriteNumber = number('Favorite Number', 42); const comfortTemp = number('Comfort Temp', 72, { range: true, min: 60, max: 90, step: 1 }); const textDecoration = select('Decoration', { - none: 'None', - underline: 'Underline', - 'line-through': 'Line-Through' + None: 'none', + Underline: 'underline', + 'Line-through': 'line-through' }, 'none'); const customStyle = object('Style', {