Storybook: addon-knobs Select | Option values as Arrays

Created on 29 Jul 2019  路  6Comments  路  Source: storybookjs/storybook

Describe the bug
As of v5.1.9 I could use arrays or any custom type as an option value with the select knob. This functionality is now not allowed as of v5.2.0-beta.*.

To Reproduce
Steps to reproduce the behavior:

  1. Create the following select knob
const mySweetSelect = select(
  'mySelect',
  {
    ones: [1],
    twos: [2, 2],
    threes: [3, 3, 3],
  },
  [1],
);
  1. Notice with v5.2.0-beta.19 there is a type error for the option values as the select option value can only be one of...
    https://github.com/storybookjs/storybook/blob/ec0fcd4fc41139d9b3d4241dd160d3c9936d7200/addons/knobs/src/components/types/Select.tsx#L7

It looks like since v5.1.9 you upgrade to typescript ( yay! 馃帀) but this value restriction causes a breaking change. I wasn't sure to put this as a feature or bug but since it broke my current usage I decided to label it as a bug. Also considering it is allowable to have arrays as values per the latest docs.

Expected behavior
Allow a generic type as an option value....

type MySpecialType = number[];
const mySweetSelect = select<MySpecialType>(
  'mySelect',
  {
    ones: [1],
    twos: [2, 2],
    threes: [3, 3, 3],
  },
  [1],
);

System:

System:
OS: macOS 10.14.5
CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
Binaries:
Node: 10.15.2 - ~/.nvm/versions/node/v10.15.2/bin/node
Yarn: 1.16.0 - /usr/local/bin/yarn
npm: 6.9.0
Browsers:
Chrome: 75.0.3770.142
Safari: 12.1.1

Additional context
Add any other context about the problem here.

knobs bug high priority todo typescript

Most helpful comment

@shilman sure thing! I'm on it :)

All 6 comments

@emilio-martinez assigned you -- hope that's ok! 馃檱

@shilman sure thing! I'm on it :)

ping

@nickofthyme Did this not fix the issue? https://github.com/storybookjs/storybook/pull/7411

@shilman No that PR predates this issue. The issue I mentioned in that PR was regarding the Array knob.

This issue is regarding the use of an Array as a value in the Select knob.

In the next branch the select knob types still don't allow Arrays 馃憞 when the docs say otherwise.

https://github.com/storybookjs/storybook/blob/824084908b2936f42774317b2b1aa1a8d2341c8d/addons/knobs/src/components/types/Select.tsx#L7

Ol茅!! I just released https://github.com/storybookjs/storybook/releases/tag/v5.2.0-rc.9 containing PR #8027 that references this issue. Upgrade today to try it out!

You can find this prerelease on the @next NPM tag.

Closing this issue. Please re-open if you think there's still more to do.

Was this page helpful?
0 / 5 - 0 ratings