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

[Slider] Allow individual mark customization #17057

Merged
merged 2 commits into from
Apr 6, 2020

Conversation

mstrugo
Copy link
Contributor

@mstrugo mstrugo commented Aug 19, 2019

Closes #17023

@mui-pr-bot
Copy link

mui-pr-bot commented Aug 19, 2019

Details of bundle changes.

Comparing: 078fd1e...b1c592c

Details of page changes
bundle Size Change Size Gzip Change Gzip
/components/icons ▲ +100 B (+0.41% ) 24.5 kB -- -1 B
/components/toggle-button ▲ +100 B (+0.95% ) 10.6 kB -- -1 B
/api-docs/avatar ▼ -10 B (-0.62% ) 1.6 kB -- -1 B
/api-docs/button ▲ +10 B (+0.43% ) 2.33 kB -- -1 B
/api-docs/input-label ▲ +10 B (+0.55% ) 1.83 kB -- -1 B
/api-docs/table-cell ▼ -10 B (-0.53% ) 1.86 kB -- -1 B
/api-docs/tree-view ▼ -10 B (-0.60% ) 1.66 kB -- -1 B
/blog/march-2019-update ▼ -10 B (-0.46% ) 2.16 kB -- -1 B
/components/button-group ▲ +10 B (+0.15% ) 6.65 kB -- -1 B
/components/transfer-list ▲ +10 B (+0.11% ) 9.22 kB -- -1 B
/customization/density ▲ +10 B (+0.11% ) 9.14 kB -- -1 B
/getting-started/templates ▲ +10 B (+0.12% ) 8.55 kB -- -1 B
/getting-started/templates/album ▲ +10 B (+0.18% ) 5.58 kB -- -1 B
/getting-started/templates/blog ▲ +10 B (+0.13% ) 7.44 kB -- -1 B
/api-docs/svg-icon ▼ -10 B (-0.50% ) 2 kB -- -1 B
/_app -- 33.7 kB -- -1 B
/api-docs/alert-title -- 1.14 kB -- -1 B
/api-docs/alert -- 2.15 kB -- -1 B
/api-docs/app-bar -- 1.69 kB -- -1 B
/api-docs/autocomplete -- 4.05 kB -- -1 B
/api-docs/avatar-group -- 1.26 kB -- -1 B
/api-docs/backdrop -- 1.38 kB -- -1 B
/api-docs/badge -- 1.88 kB -- -1 B
/api-docs/bottom-navigation-action -- 1.55 kB -- -1 B
/api-docs/bottom-navigation -- 1.43 kB -- -1 B
/api-docs/breadcrumbs -- 1.59 kB -- -1 B
/api-docs/button-base -- 2.08 kB -- -1 B
/api-docs/button-group -- 1.95 kB -- -1 B
/api-docs/card-action-area -- 1.32 kB -- -1 B
/api-docs/card-actions -- 1.22 kB -- -1 B
/api-docs/card-content -- 1.2 kB -- -1 B
/api-docs/card-header -- 1.53 kB -- -1 B
/api-docs/card-media -- 1.43 kB -- -1 B
/api-docs/card -- 1.25 kB -- -1 B
/api-docs/checkbox -- 2.05 kB -- -1 B
/api-docs/chip -- 2.19 kB -- -1 B
/api-docs/circular-progress -- 1.8 kB -- -1 B
/api-docs/click-away-listener -- 1.13 kB -- -1 B
/api-docs/collapse -- 1.76 kB -- -1 B
/api-docs/container -- 1.62 kB -- -1 B
/api-docs/css-baseline -- 1.14 kB -- -1 B
/api-docs/dialog-actions -- 1.22 kB -- -1 B
/api-docs/dialog-content-text -- 1.23 kB -- -1 B
/api-docs/dialog-content -- 1.2 kB -- -1 B
/api-docs/dialog-title -- 1.25 kB -- -1 B
/api-docs/dialog -- 2.48 kB -- -1 B
/api-docs/divider -- 1.55 kB -- -1 B
/api-docs/drawer -- 1.87 kB -- -1 B
/api-docs/expansion-panel-actions -- 1.23 kB -- -1 B
/api-docs/expansion-panel-details -- 1.16 kB -- -1 B
/api-docs/expansion-panel-summary -- 1.46 kB -- -1 B
/api-docs/expansion-panel -- 1.7 kB -- -1 B
/api-docs/fab -- 1.86 kB -- -1 B
/api-docs/fade -- 1.17 kB -- -1 B
/api-docs/filled-input -- 2.65 kB -- -1 B
/api-docs/form-control-label -- 1.73 kB -- -1 B
/api-docs/form-control -- 2.12 kB -- -1 B
/api-docs/form-group -- 1.3 kB -- -1 B
/api-docs/form-helper-text -- 1.66 kB -- -1 B
/api-docs/form-label -- 1.59 kB -- -1 B
/api-docs/grid-list-tile-bar -- 1.54 kB -- -1 B
/api-docs/grid-list-tile -- 1.46 kB -- -1 B
/api-docs/grid-list -- 1.37 kB -- -1 B
/api-docs/grid -- 2.29 kB -- -1 B
/api-docs/grow -- 1.23 kB -- -1 B
/api-docs/hidden -- 1.32 kB -- -1 B
/api-docs/icon-button -- 1.85 kB -- -1 B
/api-docs/icon -- 1.54 kB -- -1 B
/api-docs/input-adornment -- 1.68 kB -- -1 B
/api-docs/input-base -- 2.74 kB -- -1 B
/api-docs/input -- 2.61 kB -- -1 B
/api-docs/linear-progress -- 1.78 kB -- -1 B
/api-docs/link -- 1.68 kB -- -1 B
/api-docs/list-item-avatar -- 1.25 kB -- -1 B
/api-docs/list-item-icon -- 1.27 kB -- -1 B
/api-docs/list-item-secondary-action -- 1.22 kB -- -1 B
/api-docs/list-item-text -- 1.54 kB -- -1 B
/api-docs/list-item -- 2 kB -- -1 B
/api-docs/list-subheader -- 1.51 kB -- -1 B
/api-docs/list -- 1.44 kB -- -1 B
/api-docs/menu-item -- 1.48 kB -- -1 B
/api-docs/menu-list -- 1.36 kB -- -1 B
/api-docs/menu -- 2.13 kB -- -1 B
/api-docs/mobile-stepper -- 1.67 kB -- -1 B
/api-docs/modal -- 2.14 kB -- -1 B
/api-docs/native-select -- 1.83 kB -- -1 B
/api-docs/no-ssr -- 1.09 kB -- -1 B
/api-docs/outlined-input -- 2.76 kB -- -1 B
/api-docs/pagination-item -- 1.71 kB -- -1 B
/api-docs/pagination -- 1.98 kB -- -1 B
/api-docs/paper -- 1.61 kB -- -1 B
/api-docs/popover -- 2.5 kB -- -1 B
/api-docs/popper -- 1.76 kB -- -1 B
/api-docs/portal -- 1.12 kB -- -1 B
/api-docs/radio-group -- 1.23 kB -- -1 B
/api-docs/radio -- 1.87 kB -- -1 B
/api-docs/rating -- 2.25 kB -- -1 B
/api-docs/root-ref -- 1.2 kB -- -1 B
/api-docs/scoped-css-baseline -- 1.15 kB -- -1 B
/api-docs/select -- 2.65 kB -- -1 B
/api-docs/skeleton -- 1.52 kB -- -1 B
/api-docs/slide -- 1.31 kB -- -1 B
/api-docs/slider -- 2.85 kB -- -1 B
/api-docs/snackbar-content -- 1.36 kB -- -1 B
/api-docs/snackbar -- 2.46 kB -- -1 B
/api-docs/speed-dial-action -- 1.67 kB -- -1 B
/api-docs/speed-dial-icon -- 1.29 kB -- -1 B
/api-docs/speed-dial -- 2.05 kB -- -1 B
/api-docs/step-button -- 1.38 kB -- -1 B
/api-docs/step-connector -- 1.29 kB -- -1 B
/api-docs/step-content -- 1.47 kB -- -1 B
/api-docs/step-icon -- 1.33 kB -- -1 B
/api-docs/step-label -- 1.64 kB -- -1 B
/api-docs/step -- 1.38 kB -- -1 B
/api-docs/stepper -- 1.6 kB -- -1 B
/api-docs/swipeable-drawer -- 1.78 kB -- -1 B
/api-docs/switch -- 2.22 kB -- -1 B
/api-docs/tab -- 1.74 kB -- -1 B
/api-docs/table-body -- 1.21 kB -- -1 B
/api-docs/table-container -- 1.22 kB -- -1 B
/api-docs/table-footer -- 1.22 kB -- -1 B
/api-docs/table-head -- 1.21 kB -- -1 B
/api-docs/table-pagination -- 2.21 kB -- -1 B
/api-docs/table-row -- 1.43 kB -- -1 B
/api-docs/table-sort-label -- 1.57 kB -- -1 B
/api-docs/table -- 1.43 kB -- -1 B
/api-docs/tabs -- 2.28 kB -- -1 B
/api-docs/text-field -- 2.94 kB -- -1 B
/api-docs/textarea-autosize -- 908 B -- -1 B
/api-docs/toggle-button-group -- 1.56 kB -- -1 B
/api-docs/toggle-button -- 1.55 kB -- -1 B
/api-docs/toolbar -- 1.4 kB -- -1 B
/api-docs/tooltip -- 2.3 kB -- -1 B
/api-docs/tree-item -- 1.53 kB -- -1 B
/api-docs/typography -- 2.33 kB -- -1 B
/api-docs/zoom -- 1.2 kB -- -1 B
/blog/2019-developer-survey-results -- 5.98 kB -- -1 B
/blog/2019 -- 3.87 kB -- -1 B
/blog/2020-introducing-sketch -- 3.1 kB -- -1 B
/blog/april-2019-update -- 2.76 kB -- -1 B
/blog/august-2019-update -- 1.87 kB -- -1 B
/blog/december-2019-update -- 2.01 kB -- -1 B
/blog/july-2019-update -- 1.77 kB -- -1 B
/blog/june-2019-update -- 1.63 kB -- -1 B
/blog/material-ui-v1-is-out -- 6.29 kB -- -1 B
/blog/material-ui-v4-is-out -- 9.32 kB -- -1 B
/blog/may-2019-update -- 1.96 kB -- -1 B
/blog/november-2019-update -- 2.37 kB -- -1 B
/blog/october-2019-update -- 2.12 kB -- -1 B
/blog/september-2019-update -- 2.3 kB -- -1 B
/company/about -- 1.56 kB -- -1 B
/company/contact -- 1.14 kB -- -1 B
/company/jobs -- 1.16 kB -- -1 B
/components/about-the-lab -- 5.55 kB -- -1 B
/components/alert -- 12.4 kB -- -1 B
/components/app-bar -- 30.9 kB -- -1 B
/components/autocomplete -- 105 kB -- -1 B
/components/avatars -- 8.44 kB -- -1 B
/components/backdrop -- 3.31 kB -- -1 B
/components/badges -- 15 kB -- -1 B
/components/bottom-navigation -- 6.21 kB -- -1 B
/components/box -- 7.95 kB -- -1 B
/components/breadcrumbs -- 14.3 kB -- -1 B
/components/buttons -- 24.3 kB -- -1 B
/components/cards -- 16.9 kB -- -1 B
/components/checkboxes -- 16.5 kB -- -1 B
/components/chips -- 21.5 kB -- -1 B
/components/click-away-listener -- 3.38 kB -- -1 B
/components/container -- 3.83 kB -- -1 B
/components/css-baseline -- 5.96 kB -- -1 B
/components/dialogs -- 42.1 kB -- -1 B
/components/dividers -- 12.2 kB -- -1 B
/components/drawers -- 29.7 kB -- -1 B
/components/expansion-panels -- 20 kB -- -1 B
/components/floating-action-button -- 10.3 kB -- -1 B
/components/grid-list -- 11.8 kB -- -1 B
/components/grid -- 33.9 kB -- -1 B
/components/hidden -- 10.5 kB -- -1 B
/components/links -- 6.82 kB -- -1 B
/components/lists -- 25.9 kB -- -1 B
/components/material-icons -- 728 kB -- -1 B
/components/menus -- 23.4 kB -- -1 B
/components/modal -- 11.5 kB -- -1 B
/components/no-ssr -- 5.02 kB -- -1 B
/components/pagination -- 8.08 kB -- -1 B
/components/paper -- 3.33 kB -- -1 B
/components/pickers -- 38.2 kB -- -1 B
/components/popover -- 16.9 kB -- -1 B
/components/popper -- 22.5 kB -- -1 B
/components/portal -- 3.29 kB -- -1 B
/components/progress -- 21.7 kB -- -1 B
/components/radio-buttons -- 15.2 kB -- -1 B
/components/rating -- 11 kB -- -1 B
/components/selects -- 29.5 kB -- -1 B
/components/skeleton -- 10.1 kB -- -1 B
/components/slider -- 14.6 kB -- -1 B
/components/snackbars -- 24.8 kB -- -1 B
/components/speed-dial -- 14.4 kB -- -1 B
/components/steppers -- 36.1 kB -- -1 B
/components/switches -- 16 kB -- -1 B
/components/tables -- 174 kB -- -1 B
/components/tabs -- 19.2 kB -- -1 B
/components/text-fields -- 54.7 kB -- -1 B
/components/textarea-autosize -- 2.81 kB -- -1 B
/components/tooltips -- 17.3 kB -- -1 B
/components/transitions -- 10.8 kB -- -1 B
/components/tree-view -- 11.2 kB -- -1 B
/components/typography -- 9.7 kB -- -1 B
/components/use-media-query -- 13.1 kB -- -1 B
/customization/breakpoints -- 15.7 kB -- -1 B
/customization/color -- 21.5 kB -- -1 B
/customization/components -- 37.5 kB -- -1 B
/customization/default-theme -- 8.55 kB -- -1 B
/customization/globals -- 4.65 kB -- -1 B
/customization/palette -- 11.9 kB -- -1 B
/customization/spacing -- 2.49 kB -- -1 B
/customization/theming -- 17 kB -- -1 B
/customization/typography -- 11.6 kB -- -1 B
/customization/z-index -- 3.05 kB -- -1 B
/discover-more/backers -- 2.88 kB -- -1 B
/discover-more/changelog -- 1.37 kB -- -1 B
/discover-more/languages -- 3.32 kB -- -1 B
/discover-more/related-projects -- 7.09 kB -- -1 B
/discover-more/roadmap -- 3.67 kB -- -1 B
/discover-more/showcase -- 13.5 kB -- -1 B
/discover-more/team -- 6.51 kB -- -1 B
/discover-more/vision -- 7.03 kB -- -1 B
/getting-started/example-projects -- 6.11 kB -- -1 B
/getting-started/faq -- 31.8 kB -- -1 B
/getting-started/installation -- 7.6 kB -- -1 B
/getting-started/learn -- 8.39 kB -- -1 B
/getting-started/support -- 7.84 kB -- -1 B
/getting-started/supported-components -- 6.19 kB -- -1 B
/getting-started/supported-platforms -- 5.69 kB -- -1 B
/getting-started/templates/checkout -- 11.2 kB -- -1 B
/getting-started/templates/dashboard -- 8.47 kB -- -1 B
/getting-started/templates/pricing -- 7.79 kB -- -1 B
/getting-started/templates/sign-in-side -- 9.24 kB -- -1 B
/getting-started/templates/sign-in -- 9.48 kB -- -1 B
/getting-started/templates/sign-up -- 9.59 kB -- -1 B
/getting-started/templates/sticky-footer -- 1.54 kB -- -1 B
/getting-started/usage -- 9.37 kB -- -1 B
/guides/api -- 17.4 kB -- -1 B
/guides/composition -- 14.1 kB -- -1 B
/guides/flow -- 2.21 kB -- -1 B
/guides/interoperability -- 14.9 kB -- -1 B
/guides/localization -- 19.8 kB -- -1 B
/guides/migration-v0x -- 7.25 kB -- -1 B
/guides/migration-v3 -- 22.3 kB -- -1 B
/guides/minimizing-bundle-size -- 6.73 kB -- -1 B
/guides/responsive-ui -- 4.18 kB -- -1 B
/guides/right-to-left -- 6.69 kB -- -1 B
/guides/server-rendering -- 8.38 kB -- -1 B
/guides/testing -- 8.33 kB -- -1 B
/guides/typescript -- 13.4 kB -- -1 B
/performance/table-component -- 1.44 kB -- -1 B
/performance/table-emotion -- 2.97 kB -- -1 B
/performance/table-hook -- 2.23 kB -- -1 B
/performance/table-mui -- 4.42 kB -- -1 B
/performance/table-raw -- 613 B -- -1 B
/performance/table-styled-components -- 2.61 kB -- -1 B
/premium-themes/onepirate -- 7.11 kB -- -1 B
/premium-themes/onepirate/forgot-password -- 1.01 kB -- -1 B
/premium-themes/onepirate/privacy -- 4.43 kB -- -1 B
/premium-themes/onepirate/sign-in -- 1.07 kB -- -1 B
/premium-themes/onepirate/sign-up -- 1.12 kB -- -1 B
/premium-themes/onepirate/terms -- 11.8 kB -- -1 B
/premium-themes/paperbase -- 8.71 kB -- -1 B
/styles/advanced -- 30.6 kB -- -1 B
/styles/api -- 16 kB -- -1 B
/styles/basics -- 17.6 kB -- -1 B
/system/api -- 5.85 kB -- -1 B
/system/basics -- 25.1 kB -- -1 B
/system/borders -- 4.04 kB -- -1 B
/system/display -- 6.51 kB -- -1 B
/system/flexbox -- 5.72 kB -- -1 B
/system/palette -- 4.28 kB -- -1 B
/system/positions -- 2.46 kB -- -1 B
/system/shadows -- 3.44 kB -- -1 B
/system/sizing -- 3.44 kB -- -1 B
/system/spacing -- 5.97 kB -- -1 B
/system/typography -- 4.22 kB -- -1 B
/versions -- 23.1 kB -- -1 B
docs:chunk:shared -- 68.3 kB -- -1 B
docs:shared:chunk/commons -- 5.99 kB -- -1 B
docs:shared:chunk/framework -- 42.3 kB -- -1 B
docs:shared:runtime/main -- 6.78 kB -- -1 B
docs:shared:runtime/webpack -- 1.24 kB -- -1 B
bundle Size Change Size Gzip Change Gzip
@material-ui/core[umd] ▲ +51 B (+0.02% ) 321 kB ▲ +14 B (+0.02% ) 93.1 kB
Slider ▲ +51 B (+0.06% ) 80.5 kB ▲ +10 B (+0.04% ) 25.7 kB
@material-ui/core ▲ +51 B (+0.01% ) 364 kB ▲ +8 B (+0.01% ) 100 kB
@material-ui/lab -- 203 kB -- 60.4 kB
@material-ui/styles -- 52 kB -- 15.6 kB
@material-ui/system -- 17.2 kB -- 4.52 kB
Alert -- 87.6 kB -- 27.8 kB
AlertTitle -- 68.8 kB -- 21.7 kB
AppBar -- 68.7 kB -- 21.6 kB
Autocomplete -- 136 kB -- 42.8 kB
Avatar -- 69.8 kB -- 21.9 kB
AvatarGroup -- 70.8 kB -- 22.5 kB
Backdrop -- 72.5 kB -- 22.4 kB
Badge -- 70 kB -- 21.8 kB
BottomNavigation -- 67.1 kB -- 21.1 kB
BottomNavigationAction -- 79.8 kB -- 25.3 kB
Box -- 73.6 kB -- 22.4 kB
Breadcrumbs -- 84.7 kB -- 26.9 kB
Button -- 84 kB -- 25.8 kB
ButtonBase -- 78.2 kB -- 24.6 kB
ButtonGroup -- 87.5 kB -- 27.1 kB
Card -- 67.5 kB -- 21.2 kB
CardActionArea -- 79.4 kB -- 25.1 kB
CardActions -- 66.7 kB -- 20.9 kB
CardContent -- 66.6 kB -- 20.9 kB
CardHeader -- 69.7 kB -- 22 kB
CardMedia -- 67 kB -- 21.1 kB
Checkbox -- 86.4 kB -- 27.4 kB
Chip -- 86.9 kB -- 26.7 kB
CircularProgress -- 68.8 kB -- 21.7 kB
ClickAwayListener -- 3.84 kB -- 1.54 kB
Collapse -- 72.6 kB -- 22.5 kB
colorManipulator -- 3.88 kB -- 1.52 kB
Container -- 67.8 kB -- 21.2 kB
CssBaseline -- 66.6 kB -- 21 kB
Dialog -- 87.5 kB -- 27.4 kB
DialogActions -- 66.8 kB -- 20.9 kB
DialogContent -- 66.9 kB -- 21 kB
DialogContentText -- 68.7 kB -- 21.6 kB
DialogTitle -- 68.9 kB -- 21.7 kB
Divider -- 67.3 kB -- 21.2 kB
docs:/ -- 10.7 kB -- -1 B
docs:/_app -- 33.7 kB -- -1 B
Drawer -- 89.2 kB -- 27.2 kB
ExpansionPanel -- 76.2 kB -- 24 kB
ExpansionPanelActions -- 66.7 kB -- 20.9 kB
ExpansionPanelDetails -- 66.6 kB -- 20.9 kB
ExpansionPanelSummary -- 82.4 kB -- 26.2 kB
Fab -- 81.1 kB -- 25.4 kB
Fade -- 28.4 kB -- 9.47 kB
FilledInput -- 78.2 kB -- 24.4 kB
FormControl -- 69 kB -- 21.5 kB
FormControlLabel -- 70.1 kB -- 22.1 kB
FormGroup -- 66.7 kB -- 20.8 kB
FormHelperText -- 68 kB -- 21.2 kB
FormLabel -- 68.1 kB -- 21.2 kB
Grid -- 69.8 kB -- 21.9 kB
GridList -- 67.1 kB -- 21.1 kB
GridListTile -- 68.4 kB -- 21.5 kB
GridListTileBar -- 67.9 kB -- 21.3 kB
Grow -- 29 kB -- 9.68 kB
Hidden -- 70.6 kB -- 22.3 kB
Icon -- 67.5 kB -- 21.2 kB
IconButton -- 80.4 kB -- 25.2 kB
Input -- 77.2 kB -- 24.2 kB
InputAdornment -- 69.7 kB -- 22 kB
InputBase -- 75.3 kB -- 23.7 kB
InputLabel -- 69.9 kB -- 21.6 kB
LinearProgress -- 70 kB -- 21.7 kB
Link -- 71.2 kB -- 22.6 kB
List -- 67 kB -- 20.9 kB
ListItem -- 81.3 kB -- 25.5 kB
ListItemAvatar -- 66.8 kB -- 20.9 kB
ListItemIcon -- 66.8 kB -- 21 kB
ListItemSecondaryAction -- 66.7 kB -- 20.9 kB
ListItemText -- 69.6 kB -- 22 kB
ListSubheader -- 67.4 kB -- 21.2 kB
Menu -- 93.2 kB -- 28.8 kB
MenuItem -- 82.4 kB -- 25.9 kB
MenuList -- 70.7 kB -- 22.1 kB
MobileStepper -- 72.5 kB -- 22.8 kB
Modal -- 14.9 kB -- 5.23 kB
NativeSelect -- 81.5 kB -- 25.9 kB
NoSsr -- 2.18 kB -- 1.04 kB
OutlinedInput -- 79.2 kB -- 24.7 kB
Pagination -- 88.7 kB -- 27.4 kB
PaginationItem -- 85.1 kB -- 26.3 kB
Paper -- 67 kB -- 20.9 kB
Popover -- 87.6 kB -- 27.2 kB
Popper -- 28.8 kB -- 10.3 kB
Portal -- 2.87 kB -- 1.29 kB
Radio -- 87.5 kB -- 27.7 kB
RadioGroup -- 68.4 kB -- 21.3 kB
Rating -- 75.1 kB -- 24.2 kB
RootRef -- 4.62 kB -- 1.76 kB
ScopedCssBaseline -- 67.5 kB -- 21.2 kB
Select -- 120 kB -- 35.9 kB
Skeleton -- 67.7 kB -- 21.4 kB
Slide -- 30.4 kB -- 10.1 kB
Snackbar -- 79.9 kB -- 25.1 kB
SnackbarContent -- 68.2 kB -- 21.3 kB
SpeedDial -- 90.5 kB -- 28.7 kB
SpeedDialAction -- 122 kB -- 38.9 kB
SpeedDialIcon -- 69.2 kB -- 21.8 kB
Step -- 67.3 kB -- 21.2 kB
StepButton -- 86.6 kB -- 27.4 kB
StepConnector -- 67.4 kB -- 21.3 kB
StepContent -- 73.8 kB -- 23.1 kB
StepIcon -- 69.2 kB -- 21.6 kB
StepLabel -- 73.2 kB -- 22.7 kB
Stepper -- 69.5 kB -- 22 kB
styles/createMuiTheme -- 22.2 kB -- 7.69 kB
SvgIcon -- 67.7 kB -- 21.2 kB
SwipeableDrawer -- 96.6 kB -- 30.3 kB
Switch -- 85.6 kB -- 27 kB
Tab -- 80.6 kB -- 25.7 kB
Table -- 67.2 kB -- 21.1 kB
TableBody -- 66.8 kB -- 20.9 kB
TableCell -- 68.7 kB -- 21.7 kB
TableContainer -- 66.6 kB -- 20.9 kB
TableFooter -- 66.8 kB -- 20.9 kB
TableHead -- 66.8 kB -- 20.9 kB
TablePagination -- 147 kB -- 43.2 kB
TableRow -- 67.1 kB -- 21.1 kB
TableSortLabel -- 81.7 kB -- 25.9 kB
Tabs -- 89.6 kB -- 28.7 kB
TextareaAutosize -- 5.19 kB -- 2.17 kB
TextField -- 129 kB -- 37.9 kB
ToggleButton -- 80.4 kB -- 25.6 kB
ToggleButtonGroup -- 67.9 kB -- 21.4 kB
Toolbar -- 67 kB -- 21.1 kB
Tooltip -- 106 kB -- 33.6 kB
TreeItem -- 79.8 kB -- 25.4 kB
TreeView -- 73 kB -- 23 kB
Typography -- 68.3 kB -- 21.4 kB
useAutocomplete -- 16 kB -- 5.71 kB
useMediaQuery -- 2.56 kB -- 1.06 kB
Zoom -- 28.4 kB -- 9.59 kB

Generated by 🚫 dangerJS against b1c592c

@oliviertassinari oliviertassinari changed the title [RangeSlider] Add data-index to MarkLabel [Slider] Add data-index to mark labels Aug 19, 2019
@oliviertassinari oliviertassinari added component: slider This is the name of the generic UI component, not the React module! new feature New feature or request labels Aug 19, 2019
@oliviertassinari
Copy link
Member

Considering that we already have global class names, and never used DOM attributes yet for encouraging customization, after more thoughts, I propose a different approach.

Copy link
Member

@eps1lon eps1lon left a comment

Choose a reason for hiding this comment

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

Thanks for working on this issue. Could you please add a test so that we don't remove this feature in the future accidentally?

Could you also provide an example that would make use of this feature and explain why :nth-of-type would not work for that case?

@oliviertassinari
Copy link
Member

Interesting, I haven't thought about this option. With :nth-of-type and :nth-child, you have to know the offset, (4 and 5 respectively, as well as the increment, 2). So if you want to target the second mark label, you need to use :nth-of-type(6) or :nth-child(7). I'm not sure it will keep working if we change the DOM structure.

@eps1lon
Copy link
Member

eps1lon commented Aug 20, 2019

This is why a concrete use case would be nice: so that we could explore other implementations. I think you would use something classes = {label: &:nth-of-type(2) {}} (horrible pseudo code) and this should be robust against other elements in between.

It would even work for what was mentioned in the issue: Targetting the last label with :nth-last-of-type(1). This wouldn't work with indexed classnames since you need to know the number of labels.

@mstrugo
Copy link
Contributor Author

mstrugo commented Aug 20, 2019

Hi @oliviertassinari @eps1lon !
Thanks for your changes and comments.


EDIT:

Targetting the last label with :nth-last-of-type(1)

I tried to use that pseudo, but I didn't get that working through MUI Theme override.
I thought that pseudo only works with elements, and Slider renders only Span, so you need to know which position on DOM is the last label span...


I will appreciate if we have data-index or classname+index and I think could be very useful for other users.

How could I help you to get this integrated? Submitting a testcase? Trying something else?

Thanks!

@Louis345
Copy link

Louis345 commented Apr 4, 2020

I am interested in this issue, but I'm having trouble figuring out what was the solution?

@oliviertassinari
Copy link
Member

@Louis345 What's your use case? :)

@Louis345
Copy link

Louis345 commented Apr 4, 2020

@oliviertassinari Thank you so much for your prompt response. I would like to have the ability to move an individual label. On mobile with limited width, some of the labels goes off the screen. Here is an image:
Screen Shot 2020-04-04 at 7 21 57 PM

@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Apr 5, 2020
@oliviertassinari oliviertassinari added PR: ready to ship and removed PR: out-of-date The pull request has merge conflicts and can't be merged labels Apr 5, 2020
@oliviertassinari oliviertassinari changed the title [Slider] Add data-index to mark labels [Slider] Allow individual mark customization Apr 5, 2020
@Louis345
Copy link

Louis345 commented Apr 6, 2020

This is great.

@Louis345
Copy link

Louis345 commented Apr 6, 2020

How do I get it into my code? Will there be another release?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: slider This is the name of the generic UI component, not the React module! new feature New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Slider] Individual MarkLabel customization
5 participants