Material-ui: [Stepper] Port component

[nathanmarks]

• [ ] Component
• [ ] Tests (at least unit tests)
• [ ] Docs
• [ ] Demo

[alexhayes]

FYI for anyone who's thinking of starting on this I've got a working port which I'm just cleaning up.

[stunaz]

Hi @alexhayes any update on this?

[alexhayes]

@stunaz I made pretty good progress initially but I've been sick the last week and a bit so things have slowed down (it's mid winter here and colds and the flu are in abundance 🤧). I'm nearly through it all so should be able to spend some more time on it early next week.

[vladimirpekez]

Hi everyone I just started our material-ui project using v1-alpha. Our UX designer included original stepper in specs so if any help is needed I (or someone from our team) can help with any of stepper migration tasks.

[stunaz]

ping @alexhayes @oliviertassinari

[alexhayes]

Sorry folks, nothing much has changed from my end, unfortunately I've still got this flu/cold.

I can push up what I've done thus far and happy to work with you on it @vladimirpekez

[alexhayes]

@vladimirpekez I've pushed my branch which has working ports of the following;

• Horizontal/Vertical Linear
• Horizontal Non Linear Stepper

Yet to be done is;

• ~Alternative labels~
• Stepper feedback
• Tests
• Docs
• Probably better adherence to the guidelines with respect to sizing, colours etc.
• Probably more things I've forgot

Note I've only been using Chrome on Mac for testing thus far and only on desktop.

[oliviertassinari]

I have been reviewing the existing Stepper component we have on the master branch. I find the API and implementation solid. It's a good starting point. Also, we have some interesting feedback on that version

[oliviertassinari]

@alexhayes Thanks for sharing what you have done so far! I believe this is the branch you are referring to.

[alexhayes]

That's correct.

[vladimirpekez]

Thanks @alexhayes - we would checkout your branch.

[alexhayes]

@vladimirpekez after being completely bed ridden for the last two weeks with the flu I'm finally back on my feet and I'm wondering how you're getting along with your work on the Stepper port? Do you want to split up a few tasks as I listed above so we don't step on each others toes?

[vladimirpekez]

Hi Alex

Good to hear you are back on your feet! I am currently on 2 week vacation returning on 1st of August. Please do create tasks - I will take them up after August 1st.

Sent from my iPhone

On Jul 27, 2017, at 11:38 PM, Alex Hayes [e-mail] wrote:

@vladimirpekez after being completely bed ridden for the last two weeks with the flu I'm finally back on my feet and I'm wondering how you're getting along with your work on the Stepper port? Do you want to split up a few tasks as I listed above so we don't step on each others toes?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or mute the thread.

[vladimirpekez]

Hey @alexhayes, I have created a custom build with migrated Stepper for use in our project. I would like to see stepper in regular V1 build - what can I do to help?

[alexhayes]

Hi @vladimirpekez,

I've just pushed up where I'm at. I've just finished a big milestone and hoping to get back onto this next week but I'd really appreciate some help.

Todo is as follows;

1. StepContent component transition on open - the collapse transition is smooth but I believe there is something wrong with the timing of the open transition.
2. Clean up CSS
3. Ensure we're adhering to the material guidelines
4. Tests
5. Docs - Mostly done.
6. Stepper feedback - maybe we can leave this for a future release - @oliviertassinari what's your thoughts on this?

[vladimirpekez]

@alexhayes Cool - I will take a look at CSS issue today/tomorrow. Let's try to get Stepper into the next beta release :)

[vladimirpekez]

I can also cover tests, first CSS then tests...

[stunaz]

One thing I saw is that the code need to be rebased off the v1 branch, there were some breaking especially with the styles api

[alexhayes]

@vladimirpekez I've started rebasing my branch onto v1-branch - should be done shortly and I'll force push it up.

[vladimirpekez]

Hi @alexhayes I have set some time tonight (GTM+1) to work on it - I should just pull the code from your fork I guess.

[alexhayes]

@vladimirpekaz yep note that I've done a rebase in order to get my branch up to date with v1-beta.

[vladimirpekez]

@alexhayes Last time I worked on your code I forked your MUI fork. Is this the right way to go about it?

[alexhayes]

Yep, you work on your own fork and when you push changes up I'll rebase them into mine. Note that I did this with your previous commit.

[alexhayes]

@vladimirpekez I'm back onto this now, have you made any progress with anything? Just want to ensure we don't step on each others toes.

[vladimirpekez]

@alexhayes I tried to pull the code from mountain apartment where I was for a weekend but DNS was broke and I didn't managed to pull it. Update your code freely.

[alexhayes]

@vladimirpekez I've just pushed some considerable changes on my branch and it's now up to date and working with v1-beta.

• Rewrite all commit messages to conform with coding guidelines
• Removed use of createStylesheet as per #7740
• Ported demos to use next.js as per #7759
• Started cleaning up CSS

[oliviertassinari]

@alexhayes Happy to see a PR once it's ready 😄 .

[alexhayes]

Still got a bit to go but getting there.

[alexhayes]

On the home stretch now. From my list I've done the following;

1. ~StepContent component transition~ Done
2. ~Cleanup CSS~ Done
3. Tests - started porting, seems like it should be a pretty easy.

[vladimirpekez]

Hi @alexhayes, I have reserved two workdays from tomorrow GMT+1. This is my prime time. Let me know of the TODO list - seems like now only tests are left?

[vladimirpekez]

Hi @alexhayes I see lots of lint issues when I run tests on your fork. Let me fix that. I have next two days reserved for MUI - let me know what should be done.

[vladimirpekez]

@alexhayes Currently fixing lint issues - linter is crazy totalitarian :) Will create PR for your fork in around 6 hours.

[alexhayes]

@vladimirpekez I won't be working on it for the day or two so any help is much appreciated!

This is what's left, however I think tests and/or linting are priority.

1. Finish tests
2. Linting
3. Go through all legacy stepper issues and see which ones we can close. Some of them I've already confirmed as non issues or fixed in this PR - see here for an example.
4. Ensure we're adhering to the material guidelines
5. Docs.
6. Stepper feedback - but honestly I think this can wait.

[vladimirpekez]

Cool - regarding linting I have just created PR for your fork (https://github.com/alexhayes/material-ui/pull/2). I can now move to tests / docs. I agree to implement Stepper feedback in another iteration - first to push stepper into v1 beta.

[vladimirpekez]

@alexhayes, @oliviertassinari - I am having some trouble while preparing Docs and Demos for stepper. I used yarn docs:build command to build Docs & Demos and then view them offline with Chrome Extension Markdown Preview Plus.

This is what I get in Chrome when I open md file with my MD extension:

Can you please direct me to a page explaning MD workflow or explain how to build and view MD files offline?

[oliviertassinari]

@vladimirpekez Maybe yout md reader doesn't support tables. Try with the Github one or our documentation one.

[alexhayes]

Try yarn docs:dev

[vladimirpekez]

Thanks @alexhayes - docs:dev starts npm locally which is what I needed.

On Chrome/Win7 I see a CSS issue affecting stepper connector lines:

[vladimirpekez]

Also for some reason, if I have Grid container with gutter prop in a Div element below the Stepper, the gutter prop somehow ends up on div produced by Grid component:

This can be beta.9 issue as well - not tied to Stepper.

[vladimirpekez]

@alexhayes going through my code and checking what lint issue fix could affect the CSS.

[vladimirpekez]

@alexhayes fixed couple of small issues so everything looks fine now - will move to tests on monday. I have pushed all my changes to https://github.com/alexhayes/material-ui/pull/2 and will not work on it till monday. Let me know if you push anything new, lets get the stepper into next beta :)

[vladimirpekez]

Hey @alexhayes - I pushed test issues fixes. Tests are passing now. I will look at stepper legacy issues next.

[vladimirpekez]

@alexhayes Great to see my changes are merged. @oliviertassinari now that we have stepper that builds without issues I hope we can include it into next beta then perfect it in next bete releases.

[alexhayes]

I think before that can happen we probably need to finish porting the tests.

[oliviertassinari]

@vladimirpekez This is great news! Do you want to submit a PR so we can start having a look at it? :)

[salamaashoush]

@oliviertassinari @alexhayes Are you planning to merge this into v1 soon?