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.

Sign up for GitHub

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

[core] Batch small changes #17807

Merged
merged 7 commits into from
Oct 10, 2019
Merged

[core] Batch small changes #17807

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
31456ce
[docs] Remove space between /
oliviertassinari Oct 9, 2019
f9738b0
[ROADMAP] Gantt is most commonly known as Gantt chart
oliviertassinari Oct 9, 2019
d62d71a
[test] Use defaultProps for consistency
oliviertassinari Oct 9, 2019
d865097
[ROADMAP] DatePicker and DateTables should be prioritized
oliviertassinari Oct 9, 2019
68a601c
[docs] Mention the support of synonyms
oliviertassinari Oct 9, 2019
de0bf1b
Update docs/src/pages/components/material-icons/material-icons.md
oliviertassinari Oct 9, 2019
fd01db2
Update docs/src/pages/components/material-icons/material-icons.md
oliviertassinari Oct 9, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions docs/src/pages/components/material-icons/material-icons.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,3 +12,5 @@ The following npm package,
includes the 1,000+ official [Material icons](https://material.io/tools/icons/?style=baseline) converted to [`SvgIcon`](/api/svg-icon/) components.

{{"demo": "pages/components/material-icons/SearchIcons.js", "hideHeader": true}}

Tip: the search supports synonymes, try a search with "hamburger" or "logout".
oliviertassinari marked this conversation as resolved.
Show resolved Hide resolved
6 changes: 3 additions & 3 deletions docs/src/pages/discover-more/roadmap/roadmap.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,9 +68,10 @@ Here are the components we will work on being supported in the Material-UI ecosy
| AutoComplete | 🛠 |
| ComboBox | 🛠 |
| MultiSelect | 🛠 |
| Date Picker (& range) | 🛠 |
Copy link
Member

Choose a reason for hiding this comment

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

"Picker" is pretty heavy jargon and hard to translate. The nav already uses "Date input". We should stick with either one in the future.

Copy link
Member Author

@oliviertassinari oliviertassinari Oct 10, 2019 •
edited
Loading

Choose a reason for hiding this comment

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

I fear this question has been sealed for us in the past. People have learned to find this component using the "datepicker" query since jQuery, if not before.

Copy link
Member

Choose a reason for hiding this comment

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

Citation needed.

Also: All the more reason to use date input to lure these poor folks using input type="date"

Copy link
Member Author

Choose a reason for hiding this comment

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

Here is what I have in mind, we have to match what people query, not improve the searched query: this list contains, I hope, most of the most popular date picker. It's part of the list (I have removed final products) I have used for my proposal in mui/material-ui-pickers#1293 (comment)

Copy link
Member Author

Choose a reason for hiding this comment

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

using input type="date"

I think that history has teach us that most of our users don't want to use it 🙃

Copy link
Member

Choose a reason for hiding this comment

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

Why do you include links that don't include pickers and are not translated?

Copy link
Member

Choose a reason for hiding this comment

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

Here is what I have in mind, we have to match what people query,

still looking for a citation here. You reverse this to support your claim when you should provide some evidence what users first think/query vs. how they arrive at a solution

Copy link
Member Author

Choose a reason for hiding this comment

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

Where do we use "Date input"? I can't find references to it. What's a citation?

| Data Table | 🛠⭐️ |
| Alert | ⏳ |
| Carousel | ⏳ |
| Date Picker range | ⏳ |
| Dropdown | ⏳ |
| Dropzone | ⏳ |
| File Upload | ⏳ |
Expand All @@ -84,8 +85,7 @@ Here are the components we will work on being supported in the Material-UI ecosy
| Big calendar | ⏳⭐️ |
| Charts | ⏳⭐️ |
| Color picker | ⏳⭐️ |
| Data Grid | ⏳⭐️ |
| Gantt | ⏳⭐️ |
| Gantt chart | ⏳⭐️ |
| Gauge | ⏳⭐️ |
| Masonery | ⏳⭐️ |
| Pivot Grid | ⏳⭐️ |
Expand Down
4 changes: 2 additions & 2 deletions docs/translations/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
"homeQuickWord": "A quick word from our sponsors:",
"helpToTranslate": "Help to translate",
"editWebsiteColors": "Edit website colors",
"toggleTheme": "Toggle light / dark theme",
"toggleRTL": "Toggle right-to-left / left-to-right",
"toggleTheme": "Toggle light/dark theme",
"toggleRTL": "Toggle right-to-left/left-to-right",
oliviertassinari marked this conversation as resolved.
Show resolved Hide resolved
"github": "GitHub repository",
"strapline": "React components for faster and easier web development. Build your own design system, or start with Material Design.",
"getStarted": "Get Started",
Expand Down
16 changes: 9 additions & 7 deletions packages/material-ui/src/Tabs/TabScrollButton.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import TabScrollButton from './TabScrollButton';
import ButtonBase from '../ButtonBase';

describe('<TabScrollButton />', () => {
const props = {
const defaultProps = {
direction: 'left',
visible: false,
orientation: 'horizontal',
Expand All @@ -16,7 +16,7 @@ describe('<TabScrollButton />', () => {

before(() => {
shallow = createShallow({ dive: true });
classes = getClasses(<TabScrollButton {...props} />);
classes = getClasses(<TabScrollButton {...defaultProps} />);
mount = createMount({ strict: true });
});

Expand All @@ -26,7 +26,7 @@ describe('<TabScrollButton />', () => {

describe('prop: visible', () => {
it('should render as a button with the root class', () => {
const wrapper = shallow(<TabScrollButton {...props} visible />);
const wrapper = shallow(<TabScrollButton {...defaultProps} visible />);

assert.strictEqual(wrapper.type(), ButtonBase);
assert.strictEqual(wrapper.hasClass(classes.root), true);
Expand All @@ -35,7 +35,7 @@ describe('<TabScrollButton />', () => {

describe('prop: !visible', () => {
it('should render as a div with root class', () => {
const wrapper = shallow(<TabScrollButton {...props} />);
const wrapper = shallow(<TabScrollButton {...defaultProps} />);

assert.strictEqual(wrapper.name(), 'div');
assert.strictEqual(wrapper.hasClass(classes.root), true);
Expand All @@ -44,20 +44,22 @@ describe('<TabScrollButton />', () => {

describe('prop: className', () => {
it('should render with the user and root classes', () => {
const wrapper = shallow(<TabScrollButton {...props} className="woofTabScrollButton" />);
const wrapper = shallow(
<TabScrollButton {...defaultProps} className="woofTabScrollButton" />,
);
assert.strictEqual(wrapper.hasClass(classes.root), true);
assert.strictEqual(wrapper.hasClass('woofTabScrollButton'), true);
});
});

describe('prop: direction', () => {
it('should render with the left icon', () => {
const wrapper = mount(<TabScrollButton {...props} direction="left" visible />);
const wrapper = mount(<TabScrollButton {...defaultProps} direction="left" visible />);
assert.strictEqual(wrapper.find('svg[data-mui-test="KeyboardArrowLeftIcon"]').length, 1);
});

it('should render with the right icon', () => {
const wrapper = mount(<TabScrollButton {...props} direction="right" visible />);
const wrapper = mount(<TabScrollButton {...defaultProps} direction="right" visible />);
assert.strictEqual(wrapper.find('svg[data-mui-test="KeyboardArrowRightIcon"]').length, 1);
});
});
Expand Down