diff --git a/packages/addon-knobs/example/typescript/index.tsx b/packages/addon-knobs/example/typescript/index.tsx index d98bb51e924..5917454c81a 100644 --- a/packages/addon-knobs/example/typescript/index.tsx +++ b/packages/addon-knobs/example/typescript/index.tsx @@ -25,7 +25,9 @@ stories.add('with all knobs', () => { const dob = date('DOB', new Date('January 20 1887')); const bold = boolean('Bold', false); - const color = color('Color', 'black'); + const selectedColor = color('Color', 'black'); + 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', @@ -39,13 +41,15 @@ stories.add('with all knobs', () => { const style = Object.assign({}, customStyle, { fontWeight: bold ? 800: 400, - color, + color: selectedColor, textDecoration }); return (
I'm {name} and I was born on "{moment(dob).format("DD MMM YYYY")}" +

My favorite number is {favoriteNumber}.

+

My most comfortable room temperature is {comfortTemp} degrees Fahrenheit.

); });