opened
jamesfan
username_0
## Summary

Addresses #294.

Modifies the Select component to use the Canvas-designed menu instead of the native select menu.

## Checklist

<!-- Remove items that do not apply. For completed items, change [ ] to [x]. -->

- [ ] branch has been rebased on the latest master commit
- [ ] tests are changed or added
- [ ] `yarn test` passes
- [ ] all (dev)dependencies that the module needs is added to its `package.json`
- [ ] code has been documented and, if applicable, usage described in README.md
- [ ] module has been added to `canvas-kit-react` and/or `canvas-kit-css` universal modules, if
      applicable
- [ ] design approved final implementation
- [ ] a11y approved final implementation
- [ ] code adheres to the [API & Pattern guidelines](../API_PATTERN_GUIDELINES.md)
feat(select): Implement Canvas menu
issue
created
NicholasBoll
username_1
There are several Typescript errors that are preventing a Storybook example from running in Chroma
comment
created
jamesfan
username_0
@username_1 Thanks for the feedback! I'll start addressing these fixes/questions shortly.
comment
created
jamesfan
username_0
@anicholls Awesome, will do!
comment
created
jamesfan
username_0
@username_1 @anicholls

_I'm adding this as a brand new comment rather than adding it to the original thread since it's getting buried in the hidden items. Here's the original thread for reference: https://github.com/Workday/canvas-kit/pull/454#discussion_r395942602_

I've implemented the render prop (`renderOption`) in the latest changes if you'd like to check it out. I've included example code in the README as well as a `Custom Options` story.

It's a slightly modified version of Nicholas's proposed API -- I opted to have `renderOption` only handle the content of the `<SelectOption>` and not the `<SelectOption>` itself for simplicity.

It would be nice if we could use `renderOption` to render the actual Select itself (which is actually a button), but since it's a `<button>` we're limited in what we can include in its content. Something for a later PR perhaps.
comment
created
NicholasBoll
username_1
It's unfortunate how these stories show up in documentation: 
<img width="423" alt="Screen Shot 2020-04-23 at 5 11 49 PM" src="https://user-images.githubusercontent.com/338257/80158382-937feb00-8585-11ea-945f-00b42956c8fa.png">
comment
created
jamesfan
username_0
Agreed, do you think it would be preferable to remove `defaultWithSimpleOptionsComponent` and replace it with the actual component code (at the expense of adding duplicate code and making it a bit more tedious to update stories)?
comment
created
NicholasBoll
username_1
Yes. A story's implementation is meant to show an example use-case that is as copy/paste-friendly as possible. We want the source to be easy to understand.

Ideally someone could just copy/paste everything in the "source" tab of the component and make their modifications, but unfortunately Storybook's source plugin doesn't do that very well. Despite the plugin's shortcomings, I'd like to make story source as good as we can without modifying Storybook or the plugins directly. Perhaps we'll fix the source at some point in the future.

Related: #597
comment