Skip to content

[SelectField] Port SelectField component to v1#7632

Closed
kybarg wants to merge 51 commits intomui:v1-betafrom
kybarg:next-select-field
Closed

[SelectField] Port SelectField component to v1#7632
kybarg wants to merge 51 commits intomui:v1-betafrom
kybarg:next-select-field

Conversation

@kybarg
Copy link
Contributor

@kybarg kybarg commented Aug 2, 2017

This PR includes all efforts from #7458 #6608 and #6301

Hope to push it forward a bit

Closes #5716

kybarg and others added 30 commits March 8, 2017 05:53
…th form inputs, fixes dirty/clean events, and another shouldComponentUpdate
*/
disabled: PropTypes.bool,
/**
* Whether the label should be displayed in an error state.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"If true, the label will be displayed in an error state."

*/
helperTextClassName: PropTypes.string,
/**
* Whether the label should be hidden when option is selected.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"If true, the label will be hidden when that option is selected."

*/
InputLabelProps: PropTypes.object,
/**
* Passed as `inputProps` to the internal `<Input />` component.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"Properties applied to the Input element."

*/
InputProps?: Object,
/**
* Use that property to pass a ref callback to the native input component.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please could you standardise the wording of this one?

*/
required?: boolean,
/**
* Use that property to pass a ref callback to the root component.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And this one.

hideLabel,
id,
inputClassName,
InputClassName,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@kybarg Thanks for maintaining standards - if the consensus is to change this, best to do so consistently across all affected components.

@kybarg
Copy link
Contributor Author

kybarg commented Aug 30, 2017

@oliviertassinari @mbrookes I've updated this PR according to the latest requirements of the v1 branch

@stunaz
Copy link
Contributor

stunaz commented Aug 31, 2017

@kybarg right now I take it, SelectField only supports string|number as value, is it intentionnal or do you plan to also support Object as value ?

@kybarg
Copy link
Contributor Author

kybarg commented Aug 31, 2017

@stunaz The main aim of this PR is to implement "native" <select /> component with awesome Material Design look 😊
As for now, I believe, you can implement it using state and custom compareFunction

@stunaz
Copy link
Contributor

stunaz commented Aug 31, 2017

Nice!

@marcusjwhelan
Copy link

@kybarg could you add an example using an object in the docs?

@kybarg
Copy link
Contributor Author

kybarg commented Sep 1, 2017

@marcusjwhelan As I said this PR is more about bringing HTML <select> into Material-UI.
I would just keep array of values in the state and pass indexes only as value to the component to handle array of objects.

@oliviertassinari oliviertassinari self-assigned this Sep 2, 2017
@oliviertassinari
Copy link
Member

@kybarg I'm using your PR as a starting point for the migration. Good job so far 👍. Also, don't be surprised if the API is different. I'm playing around some idea I have for now.

@oliviertassinari oliviertassinari added the on hold There is a blocker, we need to wait. label Sep 2, 2017
@oallouch
Copy link

oallouch commented Sep 3, 2017

@oliviertassinari please don't forget we're all waiting for it to migrate and it's all in beta. It's ok for me if it changes later, even a lot. Anyway, it's nothing compared to the migration to v1 :)

@oliviertassinari
Copy link
Member

oliviertassinari commented Sep 3, 2017

Quick update, 20% done:

giphy

improved

  • Native version
  • Menu version
  • Accessibility
  • Edge cases
  • Finalize the API
  • Documentation
  • Unit tests
  • Flow
  • TypeScript

@ernani
Copy link

ernani commented Sep 3, 2017

Subscribing to this one! Thanks!

@oliviertassinari oliviertassinari mentioned this pull request Sep 3, 2017
12 tasks
@marcusjwhelan
Copy link

@kybarg I guess I am confused by your comment. It is very easy to add object for an array of objects on select list. I have my own I made for a select table given dynamic data already.

Would this select list be able to handle sending an array of objects? Why would I need to send the index? Can't you use the onChange event handler to capture the object in questions not needing an index?

@oliviertassinari
Copy link
Member

@marcusjwhelan It won't support an object. It will support an array for the multi select use case. It's brittle to serialize an object into an input field (that we need for taking advanage of the platform).

@kybarg
Copy link
Contributor Author

kybarg commented Sep 4, 2017

@manuelmazzuola This component is aimed to support same feature as the original HTML select https://developer.mozilla.org/en/docs/Web/HTML/Element/select

@rina-andria
Copy link

looking forward to this change. our migration to the v1 depends on this feature... thanks for the nice work!

@kybarg kybarg deleted the next-select-field branch October 11, 2018 20:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

on hold There is a blocker, we need to wait. scope: select Changes related to the select. type: new feature Expand the scope of the product to solve a new problem.

Projects

None yet

Development

Successfully merging this pull request may close these issues.