Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

is it support V1 of material-ui ? #71

Open
toolaugh opened this issue Oct 15, 2017 · 17 comments
Open

is it support V1 of material-ui ? #71

toolaugh opened this issue Oct 15, 2017 · 17 comments

Comments

@toolaugh
Copy link

No description provided.

@Sharlaan
Copy link
Owner

not yet

@gilles-yvetot
Copy link

Do you need help porting to v1?

@TarikHuber
Copy link
Collaborator

Yes. Every kind of help is welcome 😄

@gilles-yvetot
Copy link

Okay I am on it. I have done a lot of work and I think it is almost done. I do struggle with something though.

The project is running, the demo "home" page is loading but when I switch pages (e.g. http://localhost:3000/example1), I got the following error:
Cannot read property 'baseTheme' of undefined from src/SuperSelectField.js.

// Default style depending on Material-UI context (
const { baseTheme: { palette }, menuItem } = this.context.muiTheme

@Sharlaan
Copy link
Owner

muiTheme implementation got totally revamped in v1 if i remember correctly.

Your best bet to find the correct context path would be on Material-UI documentation or sources (v1+ branch).

@gilles-yvetot
Copy link

gilles-yvetot commented Jan 23, 2018

From what I am seeing here,

remove the duplication between the theme and the styleManager as we can use
this.context.styleManager.theme over this.context.theme

which I tried but this.context.styleManager is still undefined, grrrr

EDIT: After reading the changelog,

The styleManager is gone. The server side rendering configuration changed, use the sheetManager instead. The documentation was updated, you can refer to it if needed.

So I am continuing the investigation

@Sharlaan
Copy link
Owner

The whole baseTheme concept is to grab the default styles from the default/user-defined theme.

So check the source of any v1 component to find out how do they mix component-scale styles with app-scale styles(theme)
for example AppBar.js

@gilles-yvetot
Copy link

Then why do you use the context instead of wrapping your component with muiThemeable (which became withTheme) and then use the theme attached to the props?

@Sharlaan
Copy link
Owner

maybe because only way i found in v0.x were through this.context.muiTheme.

In your case, you are targeting v1.+, which got totally revamped. In that regard, i didnot look much how the new system works. "Try it !" :p

@Sharlaan Sharlaan reopened this Jan 23, 2018
@TarikHuber
Copy link
Collaborator

Hi @Sharlaan and @gilles-yvetot ,

How is it going with the migration?
MUI V1 Stable will be released next month. We should think now about the migration more seriously.
I also have to migrate now about 5 libraries -.-

@amrsobhy
Copy link

Material UI V1 is out! would really love to see this supported.

@cristianocca
Copy link

Any updates on this? I'm planning on migrating my own code to material-ui latest version but I think I can't do it until this component also updates.

@TarikHuber
Copy link
Collaborator

Hi @cristianocca and @amrsobhy ,

for my part we could not wait and made our own component for autocomplete fields with MUI V1 and used for that the established library downshift. muishift uses downshift and just Material UI components as UI. If someone needs a fast solution that should work out. Othervise a PR to this library is always welcome 😄

@cristianocca
Copy link

Thanks @TarikHuber; however, I need more than just the basic features of a select field (multi select with checkboxes for example)

@cristianocca
Copy link

@TarikHuber : Well, I couldn't wait neither and ended up "vendoring" the library into my project and adapting it to my needs (material ui 3.x and some fixes). I can't really do a PR or contribute to the actual project since I removed most of the functionalities and customizations I didn't need (in order to migrate it faster).

However, if anyone is interested, I would gladly share the the code. I have basically kept the main functionalities (simple and multi picker with checkboxes) and adapted all the components so it matches exactly all the other material UI fields (same colors, sizes, width, etc.)

@Sharlaan
Copy link
Owner

Sharlaan commented Jan 6, 2019

@cristianocca i'm interested please share in a codesandbox.

@cristianocca
Copy link

cristianocca commented Jan 6, 2019

@Sharlaan I don't really have time to make a proper example in a code sandbox. Please see the attached zip file with the code and captures of how it looks.

Keep in mind that I don't think this version of the code is suitable for everyone since I removed some features I didn't need in order to make the migration faster. Also, I wasn't able to make the infinite scroll library to work properly (which for some reason broke with the new MUI modals, I believe it's related to the new use of portals), so the dropdown won't work efficiently with massive lists. Lastly, it can't be used as a drop-in replacement of the original version since I have also renamed "floatingLabel" and similar to just "label" to match the new MUI namings.

1
2
3
4

muiSuperselect.zip

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants