@storybook/addon-knobs: groupId (#24797)

* @storybook/addon-knobs: groupId

* no spaces

* Update index.d.ts

* Update index.d.ts

* Update index.d.ts
This commit is contained in:
Joscha Feth 2018-04-12 04:58:06 +10:00 committed by Mohamed Hegazy
parent 6e26904116
commit ddfe9e664b
2 changed files with 35 additions and 11 deletions

View File

@ -25,28 +25,37 @@ export interface NumberOptions {
step: number;
}
export interface EmptyNumberOptions {
range?: undefined;
min?: undefined;
max?: undefined;
step?: undefined;
}
export function knob<T>(name: string, options: KnobOption<T>): T;
export function text(name: string, value: string | null): string;
export function text(name: string, value: string | null, groupId?: string): string;
export function boolean(name: string, value: boolean): boolean;
export function boolean(name: string, value: boolean, groupId?: string): boolean;
export function number(name: string, value: number, options?: NumberOptions): number;
export function files(label: string, accept: string, defaultValue: string[]): string[];
export function color(name: string, value: string): string;
export function number(name: string, value: number, options?: NumberOptions | EmptyNumberOptions, groupId?: string): number;
export function object<T>(name: string, value: T): T;
export function color(name: string, value: string, groupId?: string): string;
export function object<T>(name: string, value: T, groupId?: string): T;
export type SelectValue = string | number;
export function select<T extends string>(name: string, options: { [s: string]: string }, value: T): T;
export function select<T extends number>(name: string, options: { [s: number]: string }, value: T): T;
export function select<T extends SelectValue>(name: string, options: T[], value: T): T;
export function select<T extends string>(name: string, options: { [s: string]: string }, value: T, groupId?: string): T;
export function select<T extends number>(name: string, options: { [s: number]: string }, value: T, groupId?: string): T;
export function select<T extends SelectValue>(name: string, options: T[], value: T, groupId?: string): T;
export function date(name: string, value?: Date): Date;
export function date(name: string, value?: Date, groupId?: string): Date;
export function array<T>(name: string, value: T[], separator?: string): T[];
export function array<T>(name: string, value: T[], separator?: string, groupId?: string): T[];
export function button(name: string, handler: () => any): void;
export function button(name: string, handler: () => any, groupId?: string): void;
export interface WrapStoryProps {
context?: object;

View File

@ -5,6 +5,7 @@ import {
withKnobsOptions,
number,
color,
files,
object,
boolean,
text,
@ -88,3 +89,17 @@ stories.add('dynamic knobs', () => {
</div>
);
});
// groups
const groupId = 'GROUP-ID1';
text('label', 'default', groupId);
boolean('label', true, groupId);
number('label', 1, {}, groupId);
color('label', '#ffffff', groupId);
object('label', {}, groupId);
array('label', [], ',', groupId);
select<any>('label', { option: 'Option' }, null, groupId);
files('label', 'image/*', []);
date('label', new Date(), groupId);
button('label', () => undefined, groupId);