diff --git a/benchmark/browser/README.md b/benchmark/browser/README.md index 1cf256ac31df18..44924a11f83146 100644 --- a/benchmark/browser/README.md +++ b/benchmark/browser/README.md @@ -12,7 +12,7 @@ You should use these numbers exclusively for comparing performance between diffe ## Output -For compareable results ask a maintainer to approve the CircleCI job `benchmark`. +For comparable results ask a maintainer to approve the CircleCI job `benchmark`. ```sh noop (baseline): diff --git a/docs/data/joy/components/input/input.md b/docs/data/joy/components/input/input.md index bef1d81d286aa5..3d38a9c1839386 100644 --- a/docs/data/joy/components/input/input.md +++ b/docs/data/joy/components/input/input.md @@ -11,7 +11,7 @@ unstyled: /base/react-input/ ## Introduction -The Input component enhances the functionality of the native HTML `` tag by providing expanded customization options and accessibilty features. +The Input component enhances the functionality of the native HTML `` tag by providing expanded customization options and accessibility features. {{"demo": "InputUsage.js", "hideToolbar": true, "bg": "gradient"}} diff --git a/docs/data/joy/components/radio-button/radio-button-pt.md b/docs/data/joy/components/radio-button/radio-button-pt.md index b0211e0d681d92..8199b76cbbc5bc 100644 --- a/docs/data/joy/components/radio-button/radio-button-pt.md +++ b/docs/data/joy/components/radio-button/radio-button-pt.md @@ -49,7 +49,7 @@ To swap the label and radio position, use the CSS property `flex-direction: row- ### Radio group -The `RadioGrop` component is the ideal wrapper for multiple `Radio` components as it provides a tailored API for radio button grouping and proper keyboard-navigation accessibility support. +The `RadioGroup` component is the ideal wrapper for multiple `Radio` components as it provides a tailored API for radio button grouping and proper keyboard-navigation accessibility support. {{"demo": "RadioButtonsGroup.js"}} diff --git a/docs/data/joy/components/select/select.md b/docs/data/joy/components/select/select.md index d4e4953cb3e01b..3ef617c1d2439d 100644 --- a/docs/data/joy/components/select/select.md +++ b/docs/data/joy/components/select/select.md @@ -138,7 +138,7 @@ To control the placement of the listbox, use `placement`: ### `Option` component -The `Option` component is used for the chooseable options within the select. +The `Option` component is used for the choosable options within the select. The selected option inherits the `color` from the Select parent, and it uses the `primary` palette by default. However, it does not inherit the Select's used `variant`. diff --git a/docs/data/joy/components/stack/stack.md b/docs/data/joy/components/stack/stack.md index de1f9fa43929cd..f517711cc5db73 100644 --- a/docs/data/joy/components/stack/stack.md +++ b/docs/data/joy/components/stack/stack.md @@ -13,7 +13,7 @@ githubLabel: 'component: stack' The Stack component manages the layout of its immediate children along the vertical or horizontal axis, with optional spacing and dividers between each child. :::info -Stack is ideal for one-dimensional layouts, while Grid is preferable when you need both vertical _and_ hortizontal arrangement. +Stack is ideal for one-dimensional layouts, while Grid is preferable when you need both vertical _and_ horizontal arrangement. ::: {{"component": "modules/components/ComponentLinkHeader.js", "design": false}} diff --git a/docs/data/joy/components/table/table.md b/docs/data/joy/components/table/table.md index 24e41a011ebe70..c67013f616b125 100644 --- a/docs/data/joy/components/table/table.md +++ b/docs/data/joy/components/table/table.md @@ -95,7 +95,7 @@ To learn how to add custom sizes to the component, check out [Themed components ### Stripe -To create constast between rows, use the `stripe` prop with `odd` or `even` values. +To create contrast between rows, use the `stripe` prop with `odd` or `even` values. {{"demo": "TableStripe.js"}} diff --git a/docs/data/joy/components/tooltip/tooltip.md b/docs/data/joy/components/tooltip/tooltip.md index 041d0e86662222..a91fa3e8fa84ee 100644 --- a/docs/data/joy/components/tooltip/tooltip.md +++ b/docs/data/joy/components/tooltip/tooltip.md @@ -8,7 +8,7 @@ waiAria: https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/ # Tooltip -

A toolip .

+

A tooltip .

## Introduction diff --git a/docs/data/joy/getting-started/tutorial/LoginFinal.js b/docs/data/joy/getting-started/tutorial/LoginFinal.js index 3a656d0da6f631..737e3ebeac1c5d 100644 --- a/docs/data/joy/getting-started/tutorial/LoginFinal.js +++ b/docs/data/joy/getting-started/tutorial/LoginFinal.js @@ -42,7 +42,7 @@ export default function App() { sx={{ width: 300, mx: 'auto', // margin left & right - my: 4, // margin top & botom + my: 4, // margin top & bottom py: 3, // padding top & bottom px: 2, // padding left & right display: 'flex', diff --git a/docs/data/joy/getting-started/tutorial/tutorial.md b/docs/data/joy/getting-started/tutorial/tutorial.md index 3abe017ddd89b9..688ab35cd78dd4 100644 --- a/docs/data/joy/getting-started/tutorial/tutorial.md +++ b/docs/data/joy/getting-started/tutorial/tutorial.md @@ -64,7 +64,7 @@ Replace your basic Sheet from the previous step with the following `sx`-styled S sx={{ width: 300, mx: 'auto', // margin left & right - my: 4, // margin top & botom + my: 4, // margin top & bottom py: 3, // padding top & bottom px: 2, // padding left & right display: 'flex', diff --git a/docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md b/docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md index dd95b739494f1d..ced49ad07c1b84 100644 --- a/docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md +++ b/docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md @@ -344,13 +344,13 @@ import MaterialTypography, { typographyClasses as muiTypographyClasses, } from '@mui/material/Typography'; import JoyTypography, { - typographyClasses as joyTyographyClasses, + typographyClasses as joyTypographyClasses, } from '@mui/joy/Typography'; import Stack from '@mui/material/Stack'; { + const handleChange = () => { setRtl(!rtl); }; @@ -41,7 +41,7 @@ export default function RtlOptOut() {
} + control={} label="RTL" />
diff --git a/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx b/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx index 5319a203f9cab6..f1c878e6fbb630 100644 --- a/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx +++ b/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx @@ -33,7 +33,7 @@ const ltrCache = createCache({ export default function RtlOptOut() { const [rtl, setRtl] = React.useState(false); - const handleChage = () => { + const handleChange = () => { setRtl(!rtl); }; @@ -41,7 +41,7 @@ export default function RtlOptOut() {
} + control={} label="RTL" />
diff --git a/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx.preview b/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx.preview index 02689631b4dbc6..7af232b755e764 100644 --- a/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx.preview +++ b/docs/data/material/guides/right-to-left/RtlOptOutStylis.tsx.preview @@ -1,7 +1,7 @@
} + control={} label="RTL" />
diff --git a/docs/data/material/migration/migration-v4/v5-component-changes.md b/docs/data/material/migration/migration-v4/v5-component-changes.md index 88f40f45c8315d..05ebd5fd33c119 100644 --- a/docs/data/material/migration/migration-v4/v5-component-changes.md +++ b/docs/data/material/migration/migration-v4/v5-component-changes.md @@ -1445,7 +1445,7 @@ This change is meant to encourage composition. The built-in 24px padding has been removed. -To keep it intact, add the folllowing: +To keep it intact, add the following: ```diff - diff --git a/docs/data/material/migration/migration-v4/v5-style-changes.md b/docs/data/material/migration/migration-v4/v5-style-changes.md index 730e3cf10c314f..1b095b604aa2b4 100644 --- a/docs/data/material/migration/migration-v4/v5-style-changes.md +++ b/docs/data/material/migration/migration-v4/v5-style-changes.md @@ -316,7 +316,7 @@ The default `theme.palette.success` colors were changed to pass the AA accessibi ### Change default theme.palette.warning colors -The default `theme.palette.warning` colors were changed to pass the AA accesibility standard contrast ratio in both light and dark modes. +The default `theme.palette.warning` colors were changed to pass the AA accessibility standard contrast ratio in both light and dark modes. ```diff warning = { diff --git a/docs/data/system/components/grid/grid.md b/docs/data/system/components/grid/grid.md index ded3cf03e90554..215b468783a5ba 100644 --- a/docs/data/system/components/grid/grid.md +++ b/docs/data/system/components/grid/grid.md @@ -10,7 +10,7 @@ githubLabel: 'component: Grid' {{"component": "modules/components/ComponentLinkHeader.js", "design": false}} -The `Grid` component works well for a layout with known columns. The columns can be configured in multple breakpoints which you have to specify the column span of each child. +The `Grid` component works well for a layout with known columns. The columns can be configured in multiple breakpoints which you have to specify the column span of each child. ## How it works diff --git a/docs/pages/blog/mui-product-comparison.md b/docs/pages/blog/mui-product-comparison.md index 3bd8de78396d74..740fa6218ca82d 100644 --- a/docs/pages/blog/mui-product-comparison.md +++ b/docs/pages/blog/mui-product-comparison.md @@ -148,7 +148,7 @@ It features an intuitive UI and corresponding API to display different views of - **Data management:** Create, retrieve, update and delete your data with ease. - **Sophisticated data analysis:** Pin rows and columns, group and aggregate values, export your view of the data to other formats. MUI X's Data Grid is one of the most feature-rich grids available on the market today. -- **Intuitive customization:** Customizing the Data Grid's styles and behaviors works just like you'd expect if you're familar with Material UI—no new concepts to master along the way. +- **Intuitive customization:** Customizing the Data Grid's styles and behaviors works just like you'd expect if you're familiar with Material UI—no new concepts to master along the way. - **Accessibility:** It's notoriously difficult to optimize a data grid's accessibility, which is precisely why we make it a top priority—we obsess over these details so you don't have to. #### Ideal use cases diff --git a/docs/public/static/themes/onepirate/producBuoy.svg b/docs/public/static/themes/onepirate/productBuoy.svg similarity index 100% rename from docs/public/static/themes/onepirate/producBuoy.svg rename to docs/public/static/themes/onepirate/productBuoy.svg diff --git a/docs/scripts/reportBrokenLinks.js b/docs/scripts/reportBrokenLinks.js index b9b95e4da8f5ce..1bef7ecb7926d4 100644 --- a/docs/scripts/reportBrokenLinks.js +++ b/docs/scripts/reportBrokenLinks.js @@ -168,7 +168,7 @@ const getAnchor = (link) => { return potentialAnchor.includes('#') ? potentialAnchor : ''; }; -// Export usefull method for doing similar checks in other repositories +// Export useful method for doing similar checks in other repositories module.exports = { parseDocFolder, getAnchor }; /** diff --git a/docs/src/components/header/ThemeModeToggle.tsx b/docs/src/components/header/ThemeModeToggle.tsx index b7466dd7c1ac3d..ce03dfc1d7db37 100644 --- a/docs/src/components/header/ThemeModeToggle.tsx +++ b/docs/src/components/header/ThemeModeToggle.tsx @@ -40,7 +40,7 @@ export default function ThemeModeToggle(props: { }) { const theme = useTheme(); if (theme.vars) { - // Temporaly renders conditionally because `useColorScheme` could not be used in the pages that haven't migrated to CSS theme variables. + // Temporarily renders conditionally because `useColorScheme` could not be used in the pages that haven't migrated to CSS theme variables. return ; } return ( diff --git a/docs/src/components/showcase/TaskCard.tsx b/docs/src/components/showcase/TaskCard.tsx index 5803267ed95e13..44c487b58d3141 100644 --- a/docs/src/components/showcase/TaskCard.tsx +++ b/docs/src/components/showcase/TaskCard.tsx @@ -60,7 +60,7 @@ export default function TaskCard() { Assigned to - + Michael Scott diff --git a/docs/src/modules/brandingTheme.ts b/docs/src/modules/brandingTheme.ts index 2aed975c938b0f..a84576a5f47e16 100644 --- a/docs/src/modules/brandingTheme.ts +++ b/docs/src/modules/brandingTheme.ts @@ -333,7 +333,7 @@ export const getDesignTokens = (mode: 'light' | 'dark') => * } * * ------------------------------------------------------------------------------------------------- - * 💡 This util should be used in an array if the styles contain psuedo classes or nested selectors: + * 💡 This util should be used in an array if the styles contain pseudo classes or nested selectors: * * ❌ There is a chance that the upper selectors could be overridden * { diff --git a/docs/src/modules/components/AppLayoutDocsFooter.js b/docs/src/modules/components/AppLayoutDocsFooter.js index 2b7a65c9f48a19..f2da0d5d7ec3c3 100644 --- a/docs/src/modules/components/AppLayoutDocsFooter.js +++ b/docs/src/modules/components/AppLayoutDocsFooter.js @@ -308,7 +308,7 @@ export default function AppLayoutDocsFooter(props) { setCommentOpen(true); } - // Manualy move focus if commment is already open. + // Manually move focus if comment is already open. // If the comment is closed, onEntered will call focus itself; if (inputRef.current) { inputRef.current.focus(); @@ -357,7 +357,7 @@ export default function AppLayoutDocsFooter(props) { setCommentOpen(true); setCommentedSection(section); - // Manualy move focus if commment is already open. + // Manually move focus if comment is already open. // If the comment is closed, onEntered will call focus itself; if (inputRef.current) { inputRef.current.focus(); diff --git a/docs/src/modules/components/AppNavDrawerItem.js b/docs/src/modules/components/AppNavDrawerItem.js index 0cc2d3c8084bd4..d60ae825f4b7f1 100644 --- a/docs/src/modules/components/AppNavDrawerItem.js +++ b/docs/src/modules/components/AppNavDrawerItem.js @@ -5,7 +5,7 @@ import KeyboardArrowRightRoundedIcon from '@mui/icons-material/KeyboardArrowRigh import { alpha, styled } from '@mui/material/styles'; import Collapse from '@mui/material/Collapse'; import Chip from '@mui/material/Chip'; -import { shoudHandleLinkClick } from 'docs/src/modules/components/MarkdownLinks'; +import { shouldHandleLinkClick } from 'docs/src/modules/components/MarkdownLinks'; import Link from 'docs/src/modules/components/Link'; import ArticleRoundedIcon from '@mui/icons-material/ArticleRounded'; import ToggleOffRoundedIcon from '@mui/icons-material/ToggleOffRounded'; @@ -239,7 +239,7 @@ export default function AppNavDrawerItem(props) { const [open, setOpen] = React.useState(openImmediately); const handleClick = (event) => { // Ignore the action if opening the link in a new tab - if (shoudHandleLinkClick(event)) { + if (shouldHandleLinkClick(event)) { return; } diff --git a/docs/src/modules/components/AppSearch.js b/docs/src/modules/components/AppSearch.js index aad8f61442b6e8..1431c9b11f6e2e 100644 --- a/docs/src/modules/components/AppSearch.js +++ b/docs/src/modules/components/AppSearch.js @@ -156,7 +156,7 @@ function NewStartScreen() { ); } -function DocSearcHit(props) { +function DocSearchHit(props) { const { children, hit } = props; function displayTag(pathname) { @@ -196,7 +196,7 @@ function DocSearcHit(props) { return {children}; } -DocSearcHit.propTypes = { +DocSearchHit.propTypes = { children: PropTypes.node, hit: PropTypes.object.isRequired, }; @@ -340,7 +340,7 @@ export default function AppSearch() { }; }); }} - hitComponent={DocSearcHit} + hitComponent={DocSearchHit} initialScrollY={typeof window !== 'undefined' ? window.scrollY : undefined} onClose={onClose} navigator={keyboardNavigator} diff --git a/docs/src/modules/components/AppTableOfContents.js b/docs/src/modules/components/AppTableOfContents.js index 0f8d8d250dbe67..cee602915b6495 100644 --- a/docs/src/modules/components/AppTableOfContents.js +++ b/docs/src/modules/components/AppTableOfContents.js @@ -7,7 +7,7 @@ import Typography from '@mui/material/Typography'; import NoSsr from '@mui/material/NoSsr'; import Link from 'docs/src/modules/components/Link'; import { useTranslate } from 'docs/src/modules/utils/i18n'; -import { shoudHandleLinkClick } from 'docs/src/modules/components/MarkdownLinks'; +import { shouldHandleLinkClick } from 'docs/src/modules/components/MarkdownLinks'; import TableOfContentsBanner from 'docs/src/components/banner/TableOfContentsBanner'; const Nav = styled('nav')(({ theme }) => ({ @@ -194,7 +194,7 @@ export default function AppTableOfContents(props) { const handleClick = (hash) => (event) => { // Ignore click for new tab/new window behavior - if (shoudHandleLinkClick(event)) { + if (shouldHandleLinkClick(event)) { return; } diff --git a/docs/src/modules/components/DemoErrorBoundary.js b/docs/src/modules/components/DemoErrorBoundary.js index 8fa5a063f16fb3..bc79d35ae813fb 100644 --- a/docs/src/modules/components/DemoErrorBoundary.js +++ b/docs/src/modules/components/DemoErrorBoundary.js @@ -42,7 +42,7 @@ export default class DemoErrorBoundary extends React.Component { repo: 'material-ui', title, body: ` - + - [ ] I have [searched for similar issues](https://github.com/mui/material-ui/issues?q=${searchQuery}) in this repository and believe that this is not a duplicate. diff --git a/docs/src/modules/components/MarkdownLinks.js b/docs/src/modules/components/MarkdownLinks.js index 24c0245b426737..7137ce911d8fea 100644 --- a/docs/src/modules/components/MarkdownLinks.js +++ b/docs/src/modules/components/MarkdownLinks.js @@ -2,7 +2,7 @@ import * as React from 'react'; import Router from 'next/router'; import { pathnameToLanguage } from 'docs/src/modules/utils/helpers'; -export function shoudHandleLinkClick(event) { +export function shouldHandleLinkClick(event) { if ( event.defaultPrevented || event.button !== 0 || // ignore everything but left-click @@ -37,7 +37,7 @@ function handleClick(event) { } // Ignore click meant for native link handling, e.g. open in new tab - if (shoudHandleLinkClick(event)) { + if (shouldHandleLinkClick(event)) { return; } diff --git a/docs/src/modules/sandbox/Dependencies.test.js b/docs/src/modules/sandbox/Dependencies.test.js index d1ec7e6d64ef20..1a66d27d409a6e 100644 --- a/docs/src/modules/sandbox/Dependencies.test.js +++ b/docs/src/modules/sandbox/Dependencies.test.js @@ -26,7 +26,7 @@ const styles = theme => ({ display: 'flex', flexWrap: 'wrap', }, - formContro + formControl `; it('should handle @ dependencies', () => { diff --git a/docs/src/modules/utils/babel-plugin-jsx-preview.js b/docs/src/modules/utils/babel-plugin-jsx-preview.js index 567794283548d3..80dde01a35027b 100644 --- a/docs/src/modules/utils/babel-plugin-jsx-preview.js +++ b/docs/src/modules/utils/babel-plugin-jsx-preview.js @@ -47,7 +47,7 @@ export default function babelPluginJsxPreview() { // //
// ^^^^ Blank JSXText including newline - // + // // ) previewNode = previewNode.children.filter((child, index, children) => { const isSurroundingBlankJSXText = @@ -74,13 +74,13 @@ export default function babelPluginJsxPreview() { const previewLines = preview.split(/\n/); // The first line is already trimmed either due to trimmed blank JSXText or because it's a single node which babel already trims. - // The last line is therefore the meassure for indendation - const indendation = previewLines.slice(-1)[0].match(/^\s*/)[0].length; + // The last line is therefore the measure for indentation + const indentation = previewLines.slice(-1)[0].match(/^\s*/)[0].length; const deindentedPreviewLines = preview.split(/\n/).map((line, index) => { if (index === 0) { return line; } - return line.slice(indendation); + return line.slice(indentation); }); if (deindentedPreviewLines.length <= maxLines) { diff --git a/docs/src/modules/utils/replaceMarkdownLinks.test.js b/docs/src/modules/utils/replaceMarkdownLinks.test.js index f7fe13b8f3ac30..9047cd14e654d9 100644 --- a/docs/src/modules/utils/replaceMarkdownLinks.test.js +++ b/docs/src/modules/utils/replaceMarkdownLinks.test.js @@ -363,7 +363,7 @@ describe('replaceMarkdownLinks', () => { `); }); - it('does not trasform material-ui', () => { + it('does not transform material-ui', () => { expect( replaceMarkdownLinks(`[Focus Trap](https://mui.com/material-ui/react-trap-focus/)`), ).to.equal(`[Focus Trap](https://mui.com/material-ui/react-trap-focus/)`); diff --git a/docs/src/pages/careers/accessibility-engineer.md b/docs/src/pages/careers/accessibility-engineer.md index 3f338f76b4f59b..1eca7eb7c2abac 100644 --- a/docs/src/pages/careers/accessibility-engineer.md +++ b/docs/src/pages/careers/accessibility-engineer.md @@ -27,7 +27,7 @@ For additional details about the MUI team and culture, you can check our [career ## Why we're hiring -Accessibility is a strategic opportunty for MUI, across our products: +Accessibility is a strategic opportunity for MUI, across our products: 1. We are building Base UI for the developers that are looking for a relatively lower-level API while keeping a strong baseline to build on top of that saves them time. For them, it's about having a better customizability experience (style & behavior). The most exigent users of Base UI, the ones that are spreading the viral growth of the product in the community, have strong a11y requirements. So we have to meet them for Base UI to be successful. 2. Accessibility is mandated by law. For example, in the US, the Americans with Disabilities Act (ADA) is a US law enacted in 1990 to ensure people with disabilities are not discriminated against. In the EU, the European Accessibility Act (AEE) will soon be enacted. Our paid customers are increasingly asking about compliance with WCAG. diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js index 1da5b1ffaf1ee3..e730b92d9c1491 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.js @@ -28,7 +28,7 @@ function ProductSmokingHero() { diff --git a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx index 1da5b1ffaf1ee3..e730b92d9c1491 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx +++ b/docs/src/pages/premium-themes/onepirate/modules/views/ProductSmokingHero.tsx @@ -28,7 +28,7 @@ function ProductSmokingHero() { diff --git a/docs/translations/api-docs-joy/link/link.json b/docs/translations/api-docs-joy/link/link.json index 7aa34ab7b3f969..4c3417ec3ccfd7 100644 --- a/docs/translations/api-docs-joy/link/link.json +++ b/docs/translations/api-docs-joy/link/link.json @@ -6,7 +6,7 @@ "disabled": "If true, the component is disabled.", "endDecorator": "Element placed after the children.", "level": "Applies the theme typography styles.", - "overlay": "If true, the ::after psuedo element is added to cover the area of interaction. The parent of the overlay Link should have relative CSS position.", + "overlay": "If true, the ::after pseudo element is added to cover the area of interaction. The parent of the overlay Link should have relative CSS position.", "startDecorator": "Element placed before the children.", "sx": "The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.", "textColor": "The system color.", diff --git a/docs/translations/api-docs/pagination-item/pagination-item.json b/docs/translations/api-docs/pagination-item/pagination-item.json index cb41924e0f1574..1275b5ac4a476c 100644 --- a/docs/translations/api-docs/pagination-item/pagination-item.json +++ b/docs/translations/api-docs/pagination-item/pagination-item.json @@ -73,10 +73,14 @@ "conditions": "type=\"start-ellipsis\" or type=\"end-ellipsis\"" }, "firstLast": { - "description": "Styles applyed to the root element if `type=\"first\"` or type=\"last\"." + "description": "Styles applied to {{nodeName}} if {{conditions}}.", + "nodeName": "the root element", + "conditions": "type=\"first\" or type=\"last\"" }, "previousNext": { - "description": "Styles applyed to the root element if `type=\"previous\"` or type=\"next\"." + "description": "Styles applied to {{nodeName}} if {{conditions}}.", + "nodeName": "the root element", + "conditions": "type=\"previous\" or type=\"next\"" }, "focusVisible": { "description": "State class applied to {{nodeName}} if {{conditions}}.", diff --git a/docs/translations/api-docs/select/select.json b/docs/translations/api-docs/select/select.json index d821115dcd5e19..0e09fe6d4805dd 100644 --- a/docs/translations/api-docs/select/select.json +++ b/docs/translations/api-docs/select/select.json @@ -17,7 +17,7 @@ "multiple": "If true, value must be an array and the menu will support multiple selections.", "native": "If true, the component uses a native select element.", "onChange": "Callback fired when a menu item is selected.

Signature:
function(event: SelectChangeEvent<T>, child?: object) => void
event: The event source of the callback. You can pull out the new value by accessing event.target.value (any). Warning: This is a generic event, not a change event, unless the change event is caused by browser autofill.
child: The react element that was selected when native is false (default).", - "onClose": "Callback fired when the component requests to be closed. Use it in either controlled (see the open prop), or uncontrolled mode (to detect when the Select collapes).

Signature:
function(event: object) => void
event: The event source of the callback.", + "onClose": "Callback fired when the component requests to be closed. Use it in either controlled (see the open prop), or uncontrolled mode (to detect when the Select collapses).

Signature:
function(event: object) => void
event: The event source of the callback.", "onOpen": "Callback fired when the component requests to be opened. Use it in either controlled (see the open prop), or uncontrolled mode (to detect when the Select expands).

Signature:
function(event: object) => void
event: The event source of the callback.", "open": "If true, the component is shown. You can only use it when the native prop is false (default).", "renderValue": "Render the selected value. You can only use it when the native prop is false (default).

Signature:
function(value: any) => ReactNode
value: The value provided to the component.", diff --git a/docs/translations/api-docs/toolbar/toolbar.json b/docs/translations/api-docs/toolbar/toolbar.json index 9f0888f2bebbb1..2424a2ab7fccfa 100644 --- a/docs/translations/api-docs/toolbar/toolbar.json +++ b/docs/translations/api-docs/toolbar/toolbar.json @@ -1,7 +1,7 @@ { "componentDescription": "", "propDescriptions": { - "children": "The Toolbar children, usually a mixture of IconButton, Button and Typography. The Toolbar is a flex container, allowing flex item properites to be used to lay out the children.", + "children": "The Toolbar children, usually a mixture of IconButton, Button and Typography. The Toolbar is a flex container, allowing flex item properties to be used to lay out the children.", "classes": "Override or extend the styles applied to the component. See CSS API below for more details.", "component": "The component used for the root node. Either a string to use a HTML element or a component.", "disableGutters": "If true, disables gutter padding.", diff --git a/docs/translations/translations-pt.json b/docs/translations/translations-pt.json index e9a680e8f2bd20..feeebfcbbc45e8 100644 --- a/docs/translations/translations-pt.json +++ b/docs/translations/translations-pt.json @@ -63,7 +63,7 @@ "diamondSponsors": "Patrocinadores Diamante", "editPage": "Ajude a traduzir esta página", "emojiLove": "Amor", - "emoojiWarning": "Alerta", + "emojiWarning": "Alerta", "expandAll": "Expandir tudo", "feedbackCommentLabel": "Comentário", "feedbackFailed": "Não foi possível enviar comentários. Tente novamente mais tarde.", diff --git a/docs/translations/translations-zh.json b/docs/translations/translations-zh.json index 86425768f17c43..23e73d63c5c44d 100644 --- a/docs/translations/translations-zh.json +++ b/docs/translations/translations-zh.json @@ -63,7 +63,7 @@ "diamondSponsors": "钻石赞助商", "editPage": "编辑此页面", "emojiLove": "喜爱", - "emoojiWarning": "警告", + "emojiWarning": "警告", "expandAll": "展开全部", "feedbackCommentLabel": "评论", "feedbackFailed": "无法提交反馈。请稍后再试。", diff --git a/docs/translations/translations.json b/docs/translations/translations.json index ddd1585182fa60..6cce8bcb9ccf14 100644 --- a/docs/translations/translations.json +++ b/docs/translations/translations.json @@ -78,7 +78,7 @@ "editorHint": "Press Enter to start editing", "editPage": "Edit this page", "emojiLove": "Love", - "emoojiWarning": "Warning", + "emojiWarning": "Warning", "expandAll": "Expand all", "feedbackCommentLabel": "Comment", "feedbackFailed": "Couldn't submit feedback. Please try again later.", diff --git a/packages/api-docs-builder/utils/parseTest.ts b/packages/api-docs-builder/utils/parseTest.ts index 69af04b59524ab..201f3a5624b91d 100644 --- a/packages/api-docs-builder/utils/parseTest.ts +++ b/packages/api-docs-builder/utils/parseTest.ts @@ -101,7 +101,7 @@ function getInheritComponentName(valueNode: babel.types.Node): string | undefine function getSkippedTests(valueNode: babel.types.Node): string[] { if (!babel.types.isArrayExpression(valueNode)) { throw new TypeError( - `Unabled to determine skipped tests from '${valueNode.type}'. Expected an 'ArrayExpression' i.e. \`skippedTests: ["a", "b"]\`.`, + `Unable to determine skipped tests from '${valueNode.type}'. Expected an 'ArrayExpression' i.e. \`skippedTests: ["a", "b"]\`.`, ); } diff --git a/packages/eslint-plugin-material-ui/src/rules/rules-of-use-theme-variants.test.js b/packages/eslint-plugin-material-ui/src/rules/rules-of-use-theme-variants.test.js index 9553384dc94ef8..bdd7fa62f8ad52 100644 --- a/packages/eslint-plugin-material-ui/src/rules/rules-of-use-theme-variants.test.js +++ b/packages/eslint-plugin-material-ui/src/rules/rules-of-use-theme-variants.test.js @@ -100,7 +100,7 @@ ruleTester.run('rules-of-use-theme-variants', rule, { }, ], }, - // this is valid code but not analyzeable by this rule + // this is valid code but not analyzable by this rule { code: ` { diff --git a/packages/feedback/README.md b/packages/feedback/README.md index b510cb752ac347..86861ee9b411bd 100644 --- a/packages/feedback/README.md +++ b/packages/feedback/README.md @@ -34,13 +34,13 @@ with: --billing-mode PAY_PER_REQUEST \ ``` -The project includes an IAM access policy that will grant the lambda function access to the tables. You can edit the [policies/access-dynamodb.json](policies/access-dynamodb.json) file to change the access permissions. These are only applied on create (`yarn setup`). Alternatively, to avoid inadvetantly pushing changes, use the `--policies` flag with `yarn setup` to refer to a copy of this directory, and exclude it in your `~/.gitignore`. +The project includes an IAM access policy that will grant the lambda function access to the tables. You can edit the [policies/access-dynamodb.json](policies/access-dynamodb.json) file to change the access permissions. These are only applied on create (`yarn setup`). Alternatively, to avoid inadvertently pushing changes, use the `--policies` flag with `yarn setup` to refer to a copy of this directory, and exclude it in your `~/.gitignore`. > ⚠️ You will need to update the "Resource" key in this file with the value returned after creating each table. ## Get started -> ⚠️ When setting up for the first time, you will need to delete the included `claudia.json` file that is specific to the MUI installation. Alternatively, if making changes to the function that you intend to submit back, then to avoid inadvetantly commiting changes to `claudia.json`, use `--config` with each command to create and use a local config file, and exclude this file in your `~/.gitignore`. +> ⚠️ When setting up for the first time, you will need to delete the included `claudia.json` file that is specific to the MUI installation. Alternatively, if making changes to the function that you intend to submit back, then to avoid inadvertently committing changes to `claudia.json`, use `--config` with each command to create and use a local config file, and exclude this file in your `~/.gitignore`. To set this up, first [set up the credentials](https://claudiajs.com/tutorials/installing.html#configuring-access-credentials), then: diff --git a/packages/markdownlint-rule-mui/git-diff.js b/packages/markdownlint-rule-mui/git-diff.js index 99bee353801c80..116c63203a49c4 100644 --- a/packages/markdownlint-rule-mui/git-diff.js +++ b/packages/markdownlint-rule-mui/git-diff.js @@ -1,6 +1,6 @@ module.exports = { names: ['gitDiff'], - description: 'Respect the format ouput of git diff.', + description: 'Respect the format output of git diff.', tags: ['spaces'], function: (params, onError) => { params.tokens.forEach((token) => { diff --git a/packages/mui-base/src/SnackbarUnstyled/SnackbarUnstyled.test.tsx b/packages/mui-base/src/SnackbarUnstyled/SnackbarUnstyled.test.tsx index e52e0862c1efd1..f7158c9296f665 100644 --- a/packages/mui-base/src/SnackbarUnstyled/SnackbarUnstyled.test.tsx +++ b/packages/mui-base/src/SnackbarUnstyled/SnackbarUnstyled.test.tsx @@ -13,7 +13,7 @@ import SnackbarUnstyled, { snackbarUnstyledClasses as classes } from '@mui/base/ describe('', () => { const { clock, render: clientRender } = createRenderer({ clock: 'fake' }); /** - * @type {typeof plainRender extends (...args: infer T) => any ? T : enver} args + * @type {typeof plainRender extends (...args: infer T) => any ? T : never} args * * @remarks * This is for all intents and purposes the same as our client render method. diff --git a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx index 53715300970af5..c238baaacfc3d4 100644 --- a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx +++ b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx @@ -7,7 +7,7 @@ import { createMount, createRenderer, fireEvent, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import TextareaAutosize from '@mui/base/TextareaAutosize'; @@ -309,8 +309,8 @@ describe('', () => { forceUpdate(); }).toErrorDev([ 'MUI: Too many re-renders.', - !strictModeDoubleLoggingSupressed && 'MUI: Too many re-renders.', - !strictModeDoubleLoggingSupressed && 'MUI: Too many re-renders.', + !strictModeDoubleLoggingSuppressed && 'MUI: Too many re-renders.', + !strictModeDoubleLoggingSuppressed && 'MUI: Too many re-renders.', ]); }); }); diff --git a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx index 81dbdabcbd60db..6ae04f63eff498 100644 --- a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx +++ b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx @@ -167,7 +167,7 @@ const TextareaAutosize = React.forwardRef(function TextareaAutosize( }); }, [getUpdatedState]); - const syncHeightWithFlushSycn = () => { + const syncHeightWithFlushSync = () => { const newState = getUpdatedState(); if (isEmpty(newState)) { @@ -193,7 +193,7 @@ const TextareaAutosize = React.forwardRef(function TextareaAutosize( // access a dom node that is no longer there (as the fallback component is being shown instead). // See https://github.com/mui/material-ui/issues/32640 if (inputRef.current) { - syncHeightWithFlushSycn(); + syncHeightWithFlushSync(); } }); let resizeObserver: ResizeObserver; diff --git a/packages/mui-base/src/useAutocomplete/useAutocomplete.js b/packages/mui-base/src/useAutocomplete/useAutocomplete.js index 3c73c2de888b7b..8af5d5cbec66bc 100644 --- a/packages/mui-base/src/useAutocomplete/useAutocomplete.js +++ b/packages/mui-base/src/useAutocomplete/useAutocomplete.js @@ -1097,7 +1097,7 @@ export default function useAutocomplete(props) { onFocus: handleFocus, onChange: handleInputChange, onMouseDown: handleInputMouseDown, - // if open then this is handled imperativeley so don't let react override + // if open then this is handled imperatively so don't let react override // only have an opinion about this when closed 'aria-activedescendant': popupOpen ? '' : null, 'aria-autocomplete': autoComplete ? 'both' : 'list', diff --git a/packages/mui-base/src/useListbox/useListbox.types.ts b/packages/mui-base/src/useListbox/useListbox.types.ts index 592889961cba40..4474019828f0c5 100644 --- a/packages/mui-base/src/useListbox/useListbox.types.ts +++ b/packages/mui-base/src/useListbox/useListbox.types.ts @@ -25,7 +25,7 @@ enum ActionTypes { optionsChange = 'optionsChange', setValue = 'setValue', setHighlight = 'setHighlight', - textNavigation = 'textNagivation', + textNavigation = 'textNavigation', } // split declaration and export due to https://github.com/codesandbox/codesandbox-client/issues/6435 diff --git a/packages/mui-base/src/utils/useSlotProps.test.tsx b/packages/mui-base/src/utils/useSlotProps.test.tsx index aff10466c14a43..0c0da8ddbf77be 100644 --- a/packages/mui-base/src/utils/useSlotProps.test.tsx +++ b/packages/mui-base/src/utils/useSlotProps.test.tsx @@ -183,7 +183,7 @@ describe('useSlotProps', () => { test: true, }; - // provided by the user by appending additonal props on the unstyled component: + // provided by the user by appending additional props on the unstyled component: const forwardedProps = { 'data-test': 'externalForwarded', className: 'externalForwarded', diff --git a/packages/mui-codemod/src/v5.0.0/theme-augment.js b/packages/mui-codemod/src/v5.0.0/theme-augment.js index b1614bf44c4830..193e927303e9bb 100644 --- a/packages/mui-codemod/src/v5.0.0/theme-augment.js +++ b/packages/mui-codemod/src/v5.0.0/theme-augment.js @@ -25,7 +25,7 @@ export default function transformer(file, api, options) { if (node.imported.name === 'Theme') { hasTheme = true; } - if (node.imported.name === 'ThemeProvider' || node.imported.nmae === 'MuiThemeProvider') { + if (node.imported.name === 'ThemeProvider' || node.imported.name === 'MuiThemeProvider') { isRootFile = true; } }); diff --git a/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-actual.js b/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-actual.js index 9fde8370c4fc57..88de3b245d668f 100644 --- a/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-actual.js +++ b/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-actual.js @@ -154,7 +154,7 @@ const NewStartScreen = () => { ); }; -function DocSearcHit(props) { +function DocSearchHit(props) { const { children, hit } = props; function displayTag(pathname) { @@ -194,7 +194,7 @@ function DocSearcHit(props) { return {children}; } -DocSearcHit.propTypes = { +DocSearchHit.propTypes = { children: PropTypes.node, hit: PropTypes.object.isRequired, }; @@ -338,7 +338,7 @@ export default function AppSearch() { }; }); }} - hitComponent={DocSearcHit} + hitComponent={DocSearchHit} initialScrollY={typeof window !== 'undefined' ? window.scrollY : undefined} onClose={onClose} navigator={keyboardNavigator} diff --git a/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-expected.js b/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-expected.js index 1ecdce4bf8d8ed..53909746bf8b63 100644 --- a/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-expected.js +++ b/packages/mui-codemod/src/v5.0.0/theme-spacing.test/large-expected.js @@ -154,7 +154,7 @@ const NewStartScreen = () => { ); }; -function DocSearcHit(props) { +function DocSearchHit(props) { const { children, hit } = props; function displayTag(pathname) { @@ -194,7 +194,7 @@ function DocSearcHit(props) { return {children}; } -DocSearcHit.propTypes = { +DocSearchHit.propTypes = { children: PropTypes.node, hit: PropTypes.object.isRequired, }; @@ -338,7 +338,7 @@ export default function AppSearch() { }; }); }} - hitComponent={DocSearcHit} + hitComponent={DocSearchHit} initialScrollY={typeof window !== 'undefined' ? window.scrollY : undefined} onClose={onClose} navigator={keyboardNavigator} diff --git a/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx b/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx index 2d3b837783c6b1..a0d977163bb241 100644 --- a/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx +++ b/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx @@ -8,7 +8,7 @@ import { screen, act, fireEvent, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, describeJoyColorInversion, } from 'test/utils'; import Autocomplete, { @@ -684,7 +684,7 @@ describe('Joy ', () => { // reflected aria-multiline has to be false i.e. not present or false expect(textbox).not.to.have.attribute('aria-multiline'); expect(textbox).to.have.attribute('aria-autocomplete', 'list'); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); @@ -708,7 +708,7 @@ describe('Joy ', () => { const listbox = getByRole('listbox'); expect(textbox).to.have.attribute('aria-controls', listbox.getAttribute('id')!); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); @@ -730,7 +730,7 @@ describe('Joy ', () => { , ); const textbox = getByRole('combobox'); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); fireEvent.keyDown(textbox, { key: 'ArrowDown' }); @@ -738,7 +738,7 @@ describe('Joy ', () => { const options = getAllByRole('option'); expect(textbox).to.have.attribute('aria-activedescendant', options[0].getAttribute('id')!); setProps({ open: false }); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); }); @@ -1012,7 +1012,7 @@ describe('Joy ', () => { }); describe('prop: includeInputInList', () => { - it('considers the textbox the predessor of the first option when pressing Up', () => { + it('considers the textbox the predecessor of the first option when pressing Up', () => { render( , ); @@ -1168,9 +1168,9 @@ describe('Joy ', () => { fireEvent.keyDown(textbox, { key: 'Enter' }); }).toErrorDev([ 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', @@ -1219,13 +1219,13 @@ describe('Joy ', () => { render(); }).toWarnDev([ 'None of the options match with `"not a good value"`', - !strictModeDoubleLoggingSupressed && 'None of the options match with `"not a good value"`', + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', 'None of the options match with `"not a good value"`', - !strictModeDoubleLoggingSupressed && 'None of the options match with `"not a good value"`', + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', // React 18 Strict Effects run mount effects twice which lead to a cascading update React.version.startsWith('18') && 'None of the options match with `"not a good value"`', React.version.startsWith('18') && - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', ]); }); @@ -1252,7 +1252,7 @@ describe('Joy ', () => { ); }).toWarnDev([ 'returns duplicated headers', - !strictModeDoubleLoggingSupressed && 'returns duplicated headers', + !strictModeDoubleLoggingSuppressed && 'returns duplicated headers', ]); const options = screen.getAllByRole('option').map((el) => el.textContent); expect(options).to.have.length(7); diff --git a/packages/mui-joy/src/Badge/Badge.test.js b/packages/mui-joy/src/Badge/Badge.test.js index c2fb3c81d51ebd..24642708cd3d8f 100644 --- a/packages/mui-joy/src/Badge/Badge.test.js +++ b/packages/mui-joy/src/Badge/Badge.test.js @@ -146,7 +146,7 @@ describe('', () => { }); describe('prop: variant', () => { - it('addas a light class by default', () => { + it('adds a light class by default', () => { const { container } = render(); expect(findBadge(container)).to.have.class(classes.variantSolid); }); diff --git a/packages/mui-joy/src/CircularProgress/CircularProgress.tsx b/packages/mui-joy/src/CircularProgress/CircularProgress.tsx index b6346ca7b7c6a5..8d8788a4f0f397 100644 --- a/packages/mui-joy/src/CircularProgress/CircularProgress.tsx +++ b/packages/mui-joy/src/CircularProgress/CircularProgress.tsx @@ -243,7 +243,7 @@ const CircularProgress = React.forwardRef(function CircularProgress(inProps, ref additionalProps: { role: 'progressbar', style: { - // Setting this CSS varaible via inline-style + // Setting this CSS variable via inline-style // prevents the generation of new CSS every time // `value` prop updates '--CircularProgress-percent': value, diff --git a/packages/mui-joy/src/LinearProgress/LinearProgress.tsx b/packages/mui-joy/src/LinearProgress/LinearProgress.tsx index 3659c6a71d477d..42bdcd11b93760 100644 --- a/packages/mui-joy/src/LinearProgress/LinearProgress.tsx +++ b/packages/mui-joy/src/LinearProgress/LinearProgress.tsx @@ -187,7 +187,7 @@ const LinearProgress = React.forwardRef(function LinearProgress(inProps, ref) { className={clsx(classes.root, className)} role="progressbar" style={{ - // Setting this CSS varaible via inline-style + // Setting this CSS variable via inline-style // prevents the generation of new CSS every time // `value` prop updates ...({ '--LinearProgress-percent': value } as React.CSSProperties), diff --git a/packages/mui-joy/src/Link/Link.tsx b/packages/mui-joy/src/Link/Link.tsx index 81ebc9df17fb74..e186ad9f81af87 100644 --- a/packages/mui-joy/src/Link/Link.tsx +++ b/packages/mui-joy/src/Link/Link.tsx @@ -333,7 +333,7 @@ Link.propTypes /* remove-proptypes */ = { */ onFocus: PropTypes.func, /** - * If `true`, the ::after psuedo element is added to cover the area of interaction. + * If `true`, the ::after pseudo element is added to cover the area of interaction. * The parent of the overlay Link should have `relative` CSS position. * @default false */ diff --git a/packages/mui-joy/src/Link/LinkProps.ts b/packages/mui-joy/src/Link/LinkProps.ts index b81356d8dba130..5c2298f60b7c0b 100644 --- a/packages/mui-joy/src/Link/LinkProps.ts +++ b/packages/mui-joy/src/Link/LinkProps.ts @@ -72,7 +72,7 @@ export interface LinkTypeMap

{ */ level?: keyof TypographySystem | 'inherit'; /** - * If `true`, the ::after psuedo element is added to cover the area of interaction. + * If `true`, the ::after pseudo element is added to cover the area of interaction. * The parent of the overlay Link should have `relative` CSS position. * @default false */ diff --git a/packages/mui-joy/src/ModalClose/ModalClose.tsx b/packages/mui-joy/src/ModalClose/ModalClose.tsx index 7f186d99639b9e..52873a4ece92d7 100644 --- a/packages/mui-joy/src/ModalClose/ModalClose.tsx +++ b/packages/mui-joy/src/ModalClose/ModalClose.tsx @@ -50,7 +50,7 @@ export const ModalCloseRoot = styled(StyledIconButton, { top: `var(--ModalClose-inset, ${theme.spacing(1)})`, right: `var(--ModalClose-inset, ${theme.spacing(1)})`, borderRadius: `var(--ModalClose-radius, ${theme.vars.radius.sm})`, - // for variant without a background, use `tertiary` text color to reduce the importancy of the close icon. + // for variant without a background, use `tertiary` text color to reduce the importance of the close icon. ...(!theme.variants[ownerState.variant!]?.[ownerState.color!]?.backgroundColor && { color: theme.vars.palette.text.secondary, }), diff --git a/packages/mui-joy/src/RadioGroup/RadioGroup.tsx b/packages/mui-joy/src/RadioGroup/RadioGroup.tsx index 9f7d1334faba20..3b2c56e9db2bd7 100644 --- a/packages/mui-joy/src/RadioGroup/RadioGroup.tsx +++ b/packages/mui-joy/src/RadioGroup/RadioGroup.tsx @@ -142,7 +142,7 @@ const RadioGroup = React.forwardRef(function RadioGroup(inProps, ref) { as={component} ownerState={ownerState} className={clsx(classes.root, className)} - // The `id` is just for the completeness, it does not have any effect because RadioGroup (div) is non-labellable element + // The `id` is just for the completeness, it does not have any effect because RadioGroup (div) is non-labelable element // MDN: "If it is not a labelable element, then the for attribute has no effect" // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#attr-for id={formControl?.htmlFor} diff --git a/packages/mui-joy/src/Select/Select.test.tsx b/packages/mui-joy/src/Select/Select.test.tsx index c0d030a576ac89..252be6ff3c03c1 100644 --- a/packages/mui-joy/src/Select/Select.test.tsx +++ b/packages/mui-joy/src/Select/Select.test.tsx @@ -293,7 +293,7 @@ describe('Joy ); expect(getByRole('combobox')).to.have.attribute('aria-expanded', 'false'); diff --git a/packages/mui-joy/src/Tooltip/Tooltip.tsx b/packages/mui-joy/src/Tooltip/Tooltip.tsx index 231ab1cf3f4956..98e0ac6ff65cdb 100644 --- a/packages/mui-joy/src/Tooltip/Tooltip.tsx +++ b/packages/mui-joy/src/Tooltip/Tooltip.tsx @@ -135,7 +135,7 @@ const TooltipArrow = styled('span', { width: 'var(--Tooltip-arrowSize)', height: 'var(--Tooltip-arrowSize)', boxSizing: 'border-box', - // use psuedo element because Popper controls the `transform` property of the arrow. + // use pseudo element because Popper controls the `transform` property of the arrow. '&:before': { content: '""', display: 'block', diff --git a/packages/mui-joy/src/styles/ColorInversion.tsx b/packages/mui-joy/src/styles/ColorInversion.tsx index 364b01d49e93e5..4c9421622f2ada 100644 --- a/packages/mui-joy/src/styles/ColorInversion.tsx +++ b/packages/mui-joy/src/styles/ColorInversion.tsx @@ -6,7 +6,7 @@ import { ColorPaletteProp, VariantProp } from './types'; const ColorInversion = React.createContext>(undefined); export const useColorInversion = (childVariant: VariantProp | undefined) => { - const overriableVariants = React.useContext(ColorInversion); + const overridableVariants = React.useContext(ColorInversion); return { /** * Resolve the `color` value for the component. @@ -17,8 +17,8 @@ export const useColorInversion = (childVariant: VariantProp | undefined) => { instanceColorProp: ColorPaletteProp | 'inherit' | undefined, defaultColorProp: ColorPaletteProp | 'inherit' | undefined, ): ColorPaletteProp | 'context' | undefined => { - if (overriableVariants && childVariant) { - if (overriableVariants.includes(childVariant)) { + if (overridableVariants && childVariant) { + if (overridableVariants.includes(childVariant)) { // @ts-ignore internal logic return instanceColorProp || 'context'; } diff --git a/packages/mui-joy/src/styles/CssVarsProvider.spec.tsx b/packages/mui-joy/src/styles/CssVarsProvider.spec.tsx index fbcfa3220faef9..5b877fa7a3b237 100644 --- a/packages/mui-joy/src/styles/CssVarsProvider.spec.tsx +++ b/packages/mui-joy/src/styles/CssVarsProvider.spec.tsx @@ -3,7 +3,7 @@ import { CSSObject } from '@mui/system'; import { CssVarsProvider, extendTheme } from '@mui/joy/styles'; // ----------------------------------- -// Extending palete +// Extending palette declare module '@mui/joy/styles' { interface ColorSchemeOverrides { diff --git a/packages/mui-joy/src/styles/variantUtils.ts b/packages/mui-joy/src/styles/variantUtils.ts index d3d586cf24ccbb..0806d4006c09cc 100644 --- a/packages/mui-joy/src/styles/variantUtils.ts +++ b/packages/mui-joy/src/styles/variantUtils.ts @@ -30,7 +30,7 @@ const assignCss = (target: Record, variantVar: string, value: st * @example 'plain' * * @param palette object that contains palette tokens - * @example { primary: { plainColor: '', plainHoverColor: '', ...tokens }, ...other palete } + * @example { primary: { plainColor: '', plainHoverColor: '', ...tokens }, ...other palette } * * @param getCssVar a function that receive variant token and return a CSS variable * diff --git a/packages/mui-joy/src/utils/useSlot.test.tsx b/packages/mui-joy/src/utils/useSlot.test.tsx index 671014d72b1ead..ae55e2d45d8efc 100644 --- a/packages/mui-joy/src/utils/useSlot.test.tsx +++ b/packages/mui-joy/src/utils/useSlot.test.tsx @@ -107,7 +107,7 @@ describe('useSlot', () => { expect(getByRole('button').firstChild).to.have.class('size-md'); }); - it('slot ownerstate should be overriable', () => { + it('slot ownerstate should be overridable', () => { const { getByRole } = render(); expect(getByRole('button').firstChild).to.have.class('size-sm'); }); diff --git a/packages/mui-material-next/src/Button/Button.tsx b/packages/mui-material-next/src/Button/Button.tsx index e70d2a9953551e..114ad81c54f767 100644 --- a/packages/mui-material-next/src/Button/Button.tsx +++ b/packages/mui-material-next/src/Button/Button.tsx @@ -116,7 +116,7 @@ export const ButtonRoot = styled('button', { text: tokens.sys.color[ownerState.color ?? 'primary'], }; - const disabeldContainerColor = { + const disabledContainerColor = { elevated: theme.vars ? `rgba(${theme.vars.sys.color.onSurfaceChannel} / 0.12)` : alpha(theme.sys.color.onSurface, 0.12), @@ -282,7 +282,7 @@ export const ButtonRoot = styled('button', { '--md-comp-button-pressed-icon-color': labelTextColor[ownerState.variant ?? 'text'], // same as default '--md-comp-button-focused-icon-color': labelTextColor[ownerState.variant ?? 'text'], // same as default '--md-comp-button-disabled-icon-color': disabledLabelTextColor, - // Noramlized styles for buttons + // Normalized styles for buttons display: 'inline-flex', alignItems: 'center', justifyContent: 'center', @@ -322,7 +322,7 @@ export const ButtonRoot = styled('button', { backgroundColor: containerColor[ownerState.variant ?? 'text'], color: labelTextColor[ownerState.variant ?? 'text'], boxShadow: containerElevation[ownerState.variant ?? 'text'], - // Outlined varaiant + // Outlined variant ...(ownerState.variant === 'outlined' && { border: `1px solid ${tokens.sys.color.outline}`, padding: '9px 23px', @@ -363,12 +363,12 @@ export const ButtonRoot = styled('button', { boxShadow: focusedContainerElevation[ownerState.variant ?? 'text'], }, [`&.${buttonClasses.disabled}`]: { - // Allows deverloper to specify the disabled icon color var + // Allows developer to specify the disabled icon color var '--md-comp-button-icon-color': 'var(--md-comp-button-disabled-icon-color)', pointerEvents: 'none', // Disable link interactions cursor: 'default', color: disabledLabelTextColor, - backgroundColor: disabeldContainerColor[ownerState.variant ?? 'text'], + backgroundColor: disabledContainerColor[ownerState.variant ?? 'text'], boxShadow: tokens.sys.elevation[0], ...(ownerState.variant === 'outlined' && { border: `1px solid ${ diff --git a/packages/mui-material-next/src/Input/Input.test.js b/packages/mui-material-next/src/Input/Input.test.js index 8eeb3c60bd27cb..57cc9e4a9097fb 100644 --- a/packages/mui-material-next/src/Input/Input.test.js +++ b/packages/mui-material-next/src/Input/Input.test.js @@ -164,7 +164,7 @@ describe('', () => { }); describe('errors', () => { - it('throws on change if the target isnt mocked', () => { + it("throws on change if the target isn't mocked", () => { /** * This component simulates a custom input component that hides the inner * input value for security reasons e.g. react-stripe-element. diff --git a/packages/mui-material-next/src/Tabs/Tabs.js b/packages/mui-material-next/src/Tabs/Tabs.js index b8170544d5628b..a3a9032665cdfb 100644 --- a/packages/mui-material-next/src/Tabs/Tabs.js +++ b/packages/mui-material-next/src/Tabs/Tabs.js @@ -413,7 +413,7 @@ const Tabs = React.forwardRef(function Tabs(inProps, ref) { moveTabsScroll(getScrollSize()); }; - // TODO Remove as browser support for hidding the scrollbar + // TODO Remove as browser support for hiding the scrollbar // with CSS improves. const handleScrollbarSizeChange = React.useCallback((scrollbarWidth) => { setScrollerStyle({ diff --git a/packages/mui-material-next/src/Tabs/Tabs.test.js b/packages/mui-material-next/src/Tabs/Tabs.test.js index 750b97c9af6b41..9fe906e7e9c801 100644 --- a/packages/mui-material-next/src/Tabs/Tabs.test.js +++ b/packages/mui-material-next/src/Tabs/Tabs.test.js @@ -7,7 +7,7 @@ import { createRenderer, fireEvent, screen, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import Tab from '@mui/material-next/Tab'; import Tabs, { tabsClasses as classes } from '@mui/material-next/Tabs'; @@ -90,10 +90,10 @@ describe('', () => { render(); }).toErrorDev([ 'MUI: You can not use the `centered={true}` and `variant="scrollable"`', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: You can not use the `centered={true}` and `variant="scrollable"`', 'MUI: You can not use the `centered={true}` and `variant="scrollable"`', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: You can not use the `centered={true}` and `variant="scrollable"`', ]); }); diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js index 668a7fe5a3f748..0315f2c653166a 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.test.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.test.js @@ -7,7 +7,7 @@ import { createRenderer, fireEvent, screen, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import { spy } from 'sinon'; import { ThemeProvider, createTheme } from '@mui/material/styles'; @@ -835,7 +835,7 @@ describe('', () => { // reflected aria-multiline has to be false i.e. not present or false expect(textbox).not.to.have.attribute('aria-multiline'); expect(textbox).to.have.attribute('aria-autocomplete', 'list'); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); @@ -865,7 +865,7 @@ describe('', () => { const listbox = getByRole('listbox'); expect(textbox).to.have.attribute('aria-controls', listbox.getAttribute('id')); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); @@ -891,7 +891,7 @@ describe('', () => { />, ); const textbox = getByRole('combobox'); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); fireEvent.keyDown(textbox, { key: 'ArrowDown' }); @@ -899,7 +899,7 @@ describe('', () => { const options = getAllByRole('option'); expect(textbox).to.have.attribute('aria-activedescendant', options[0].getAttribute('id')); setProps({ open: false }); - expect(textbox, 'no option is focused when openened').not.to.have.attribute( + expect(textbox, 'no option is focused when opened').not.to.have.attribute( 'aria-activedescendant', ); }); @@ -1252,7 +1252,7 @@ describe('', () => { }); describe('prop: includeInputInList', () => { - it('considers the textbox the predessor of the first option when pressing Up', () => { + it('considers the textbox the predecessor of the first option when pressing Up', () => { render( ', () => { fireEvent.keyDown(textbox, { key: 'Enter' }); }).toErrorDev([ 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', 'MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string', @@ -1535,13 +1535,13 @@ describe('', () => { ); }).toWarnDev([ 'None of the options match with `"not a good value"`', - !strictModeDoubleLoggingSupressed && 'None of the options match with `"not a good value"`', + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', 'None of the options match with `"not a good value"`', - !strictModeDoubleLoggingSupressed && 'None of the options match with `"not a good value"`', + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', // React 18 Strict Effects run mount effects twice which lead to a cascading update React.version.startsWith('18') && 'None of the options match with `"not a good value"`', React.version.startsWith('18') && - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'None of the options match with `"not a good value"`', ]); }); @@ -1568,7 +1568,7 @@ describe('', () => { ); }).toWarnDev([ 'returns duplicated headers', - !strictModeDoubleLoggingSupressed && 'returns duplicated headers', + !strictModeDoubleLoggingSuppressed && 'returns duplicated headers', ]); const options = screen.getAllByRole('option').map((el) => el.textContent); expect(options).to.have.length(7); diff --git a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js index 7478305de88eca..9002f7388dc6e5 100644 --- a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js +++ b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js @@ -5,7 +5,7 @@ import { describeConformance, createRenderer, screen, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import Breadcrumbs, { breadcrumbsClasses as classes } from '@mui/material/Breadcrumbs'; import FirstPageIcon from '../internal/svg-icons/FirstPage'; @@ -93,7 +93,7 @@ describe('', () => { ); }).toErrorDev([ 'MUI: You have provided an invalid combination of props to the Breadcrumbs.\nitemsAfterCollapse={2} + itemsBeforeCollapse={2} >= maxItems={3}', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: You have provided an invalid combination of props to the Breadcrumbs.\nitemsAfterCollapse={2} + itemsBeforeCollapse={2} >= maxItems={3}', ]); expect(screen.getAllByRole('listitem', { hidden: false })).to.have.length(4); diff --git a/packages/mui-material/src/ButtonBase/ButtonBase.test.js b/packages/mui-material/src/ButtonBase/ButtonBase.test.js index e03a0f15a2efde..079846a3ea0d78 100644 --- a/packages/mui-material/src/ButtonBase/ButtonBase.test.js +++ b/packages/mui-material/src/ButtonBase/ButtonBase.test.js @@ -1236,7 +1236,7 @@ describe('', () => { }); }); - describe('prop: touchRipplepRef', () => { + describe('prop: touchRippleRef', () => { it('should return a ref', () => { const ref = React.createRef(); render(); diff --git a/packages/mui-material/src/Container/Container.test.js b/packages/mui-material/src/Container/Container.test.js index fa1b005a0f2c18..c0ed5d82ab34b1 100644 --- a/packages/mui-material/src/Container/Container.test.js +++ b/packages/mui-material/src/Container/Container.test.js @@ -24,10 +24,10 @@ describe('', () => { it('should support different maxWidth values', () => { const { container: firstContainer } = render(); expect(firstContainer.firstChild).to.have.class(classes.maxWidthLg); - const { container: secondsContainre } = render( + const { container: secondsContainer } = render( , ); - expect(secondsContainre.firstChild).not.to.have.class(classes.maxWidthLg); + expect(secondsContainer.firstChild).not.to.have.class(classes.maxWidthLg); }); }); }); diff --git a/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js b/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js index 2adce270d94b81..648f8bf43e92c8 100644 --- a/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js +++ b/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js @@ -41,7 +41,7 @@ describe('', () => { expect(getByText(/Pizza/)).to.have.class(classes.label); }); - it('should render numberic labels', () => { + it('should render numeric labels', () => { const { getByText } = render(} />); expect(getByText(/5/)).not.to.equal(null); diff --git a/packages/mui-material/src/Hidden/HiddenCss.test.js b/packages/mui-material/src/Hidden/HiddenCss.test.js index bfd1d95b64fcf1..83f7c4f279b0a5 100644 --- a/packages/mui-material/src/Hidden/HiddenCss.test.js +++ b/packages/mui-material/src/Hidden/HiddenCss.test.js @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import { createRenderer, strictModeDoubleLoggingSupressed } from 'test/utils'; +import { createRenderer, strictModeDoubleLoggingSuppressed } from 'test/utils'; import HiddenCss from './HiddenCss'; import { createTheme, ThemeProvider } from '../styles'; import classes from './hiddenCssClasses'; @@ -145,7 +145,7 @@ describe('', () => { ); }).toErrorDev([ 'MUI: Unsupported props received by ``: xxlUp.', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: Unsupported props received by ``: xxlUp.', ]); }); diff --git a/packages/mui-material/src/InputAdornment/InputAdornment.test.js b/packages/mui-material/src/InputAdornment/InputAdornment.test.js index 9448bd91a17340..bf7020be5bec60 100644 --- a/packages/mui-material/src/InputAdornment/InputAdornment.test.js +++ b/packages/mui-material/src/InputAdornment/InputAdornment.test.js @@ -1,6 +1,6 @@ import * as React from 'react'; import { expect } from 'chai'; -import { createRenderer, describeConformance, strictModeDoubleLoggingSupressed } from 'test/utils'; +import { createRenderer, describeConformance, strictModeDoubleLoggingSuppressed } from 'test/utils'; import { typographyClasses } from '@mui/material/Typography'; import InputAdornment, { inputAdornmentClasses as classes } from '@mui/material/InputAdornment'; import TextField from '@mui/material/TextField'; @@ -136,7 +136,7 @@ describe('', () => { }).toErrorDev([ 'MUI: The `InputAdornment` variant infers the variant ' + 'prop you do not have to provide one.', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The `InputAdornment` variant infers the variant ' + 'prop you do not have to provide one.', ]); diff --git a/packages/mui-material/src/InputBase/InputBase.test.js b/packages/mui-material/src/InputBase/InputBase.test.js index 992734065cc418..f7b8af03013f0d 100644 --- a/packages/mui-material/src/InputBase/InputBase.test.js +++ b/packages/mui-material/src/InputBase/InputBase.test.js @@ -265,7 +265,7 @@ describe('', () => { }); describe('errors', () => { - it('throws on change if the target isnt mocked', () => { + it("throws on change if the target isn't mocked", () => { /** * This component simulates a custom input component that hides the inner * input value for security reasons e.g. react-stripe-element. @@ -538,7 +538,7 @@ describe('', () => { }); it('should not warn when toggling between inputs', () => { - // this will ensure that unregistering was called during unmount + // this will ensure that deregistering was called during unmount function ToggleFormInputs() { const [flag, setFlag] = React.useState(true); diff --git a/packages/mui-material/src/LinearProgress/LinearProgress.test.js b/packages/mui-material/src/LinearProgress/LinearProgress.test.js index 871b90b75351ea..ac41f4bb04c7d9 100644 --- a/packages/mui-material/src/LinearProgress/LinearProgress.test.js +++ b/packages/mui-material/src/LinearProgress/LinearProgress.test.js @@ -4,7 +4,7 @@ import { createRenderer, screen, describeConformance, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import LinearProgress, { linearProgressClasses as classes } from '@mui/material/LinearProgress'; @@ -156,7 +156,7 @@ describe('', () => { ({ rerender } = render()); }).toErrorDev([ 'MUI: You need to provide a value prop', - !strictModeDoubleLoggingSupressed && 'MUI: You need to provide a value prop', + !strictModeDoubleLoggingSuppressed && 'MUI: You need to provide a value prop', ]); expect(() => { @@ -164,8 +164,8 @@ describe('', () => { }).toErrorDev([ 'MUI: You need to provide a value prop', 'MUI: You need to provide a valueBuffer prop', - !strictModeDoubleLoggingSupressed && 'MUI: You need to provide a value prop', - !strictModeDoubleLoggingSupressed && 'MUI: You need to provide a valueBuffer prop', + !strictModeDoubleLoggingSuppressed && 'MUI: You need to provide a value prop', + !strictModeDoubleLoggingSuppressed && 'MUI: You need to provide a valueBuffer prop', ]); }); }); diff --git a/packages/mui-material/src/ListItem/ListItem.test.js b/packages/mui-material/src/ListItem/ListItem.test.js index 320853e28be24e..8552b641a0435b 100644 --- a/packages/mui-material/src/ListItem/ListItem.test.js +++ b/packages/mui-material/src/ListItem/ListItem.test.js @@ -175,7 +175,7 @@ describe('', () => { classes: {}, children: [ I should have come last :(, - My position doesn not matter., + My position does not matter., ], }, 'prop', diff --git a/packages/mui-material/src/ListItemText/ListItemText.spec.tsx b/packages/mui-material/src/ListItemText/ListItemText.spec.tsx index eab98a93e51fe2..b9c868dbaf96cc 100644 --- a/packages/mui-material/src/ListItemText/ListItemText.spec.tsx +++ b/packages/mui-material/src/ListItemText/ListItemText.spec.tsx @@ -13,7 +13,7 @@ function typographyPropsTest() { primaryTypographyProps={{ component: 'a', // @ts-expect-error - htmlFor: 'not-existance-attribute', + htmlFor: 'nonexistent-attribute', }} />; ; ; styles.paper, })({ // specZ: The maximum height of a simple menu should be one or more rows less than the view - // height. This ensures a tapable area outside of the simple menu with which to dismiss + // height. This ensures a tappable area outside of the simple menu with which to dismiss // the menu. maxHeight: 'calc(100% - 96px)', // Add iOS momentum scrolling for iOS < 13.0 diff --git a/packages/mui-material/src/Menu/Menu.test.js b/packages/mui-material/src/Menu/Menu.test.js index 3d26dcaa5160ea..d4a98a3632fc36 100644 --- a/packages/mui-material/src/Menu/Menu.test.js +++ b/packages/mui-material/src/Menu/Menu.test.js @@ -6,7 +6,7 @@ import { describeConformance, screen, fireEvent, - strictModeDoubleLoggingSupressed, + strictModeDoubleLoggingSuppressed, } from 'test/utils'; import Menu, { menuClasses as classes } from '@mui/material/Menu'; import Popover from '@mui/material/Popover'; @@ -269,7 +269,7 @@ describe('

', () => { ); }).toErrorDev([ "MUI: The Menu component doesn't accept a Fragment as a child.", - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && "MUI: The Menu component doesn't accept a Fragment as a child.", ]); }); diff --git a/packages/mui-material/src/PaginationItem/paginationItemClasses.ts b/packages/mui-material/src/PaginationItem/paginationItemClasses.ts index c5cce0f87b1f42..600bfce121c628 100644 --- a/packages/mui-material/src/PaginationItem/paginationItemClasses.ts +++ b/packages/mui-material/src/PaginationItem/paginationItemClasses.ts @@ -26,9 +26,9 @@ export interface PaginationItemClasses { rounded: string; /** Styles applied to the root element if `type="start-ellipsis"` or `type="end-ellipsis"`. */ ellipsis: string; - /** Styles applyed to the root element if `type="first"` or type="last". */ + /** Styles applied to the root element if `type="first"` or type="last". */ firstLast: string; - /** Styles applyed to the root element if `type="previous"` or type="next". */ + /** Styles applied to the root element if `type="previous"` or type="next". */ previousNext: string; /** State class applied to the root element if keyboard focused. */ focusVisible: string; diff --git a/packages/mui-material/src/Paper/Paper.test.js b/packages/mui-material/src/Paper/Paper.test.js index 8aed1af0c94494..98664deeaff0d3 100644 --- a/packages/mui-material/src/Paper/Paper.test.js +++ b/packages/mui-material/src/Paper/Paper.test.js @@ -1,7 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import PropTypes from 'prop-types'; -import { createRenderer, describeConformance, strictModeDoubleLoggingSupressed } from 'test/utils'; +import { createRenderer, describeConformance, strictModeDoubleLoggingSuppressed } from 'test/utils'; import Paper, { paperClasses as classes } from '@mui/material/Paper'; import { createTheme, ThemeProvider } from '@mui/material/styles'; @@ -91,7 +91,7 @@ describe('', () => { render(); }).toErrorDev([ 'MUI: The elevation provided is not available in the theme.', - !strictModeDoubleLoggingSupressed && + !strictModeDoubleLoggingSuppressed && 'MUI: The elevation provided is not available in the theme.', ]); }); diff --git a/packages/mui-material/src/Rating/Rating.test.js b/packages/mui-material/src/Rating/Rating.test.js index ad09f516b2c67e..8323fb3238ba35 100644 --- a/packages/mui-material/src/Rating/Rating.test.js +++ b/packages/mui-material/src/Rating/Rating.test.js @@ -191,7 +191,7 @@ describe('', () => { before(function beforeHook() { if (/jsdom/.test(window.navigator.userAgent)) { // JSDOM has issues with form validation for certain elements. - // We could adress them individually but that doesn't add much value if we already have a working environment. + // We could address them individually but that doesn't add much value if we already have a working environment. this.skip(); } }); diff --git a/packages/mui-material/src/Select/Select.d.ts b/packages/mui-material/src/Select/Select.d.ts index 77771cc034b232..84c256c67f7eed 100644 --- a/packages/mui-material/src/Select/Select.d.ts +++ b/packages/mui-material/src/Select/Select.d.ts @@ -104,7 +104,7 @@ export interface SelectProps onChange?: SelectInputProps['onChange']; /** * Callback fired when the component requests to be closed. - * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapes). + * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapses). * * @param {object} event The event source of the callback. */ diff --git a/packages/mui-material/src/Select/Select.js b/packages/mui-material/src/Select/Select.js index deff5dda5dd855..605a8ab344f4e8 100644 --- a/packages/mui-material/src/Select/Select.js +++ b/packages/mui-material/src/Select/Select.js @@ -225,7 +225,7 @@ Select.propTypes /* remove-proptypes */ = { onChange: PropTypes.func, /** * Callback fired when the component requests to be closed. - * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapes). + * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapses). * * @param {object} event The event source of the callback. */ diff --git a/packages/mui-material/src/Select/Select.test.js b/packages/mui-material/src/Select/Select.test.js index 5f27e00467ffde..2806dd8fb2c68d 100644 --- a/packages/mui-material/src/Select/Select.test.js +++ b/packages/mui-material/src/Select/Select.test.js @@ -442,7 +442,7 @@ describe('); expect(getByRole('button')).to.have.attribute('aria-expanded', 'false'); @@ -999,7 +999,7 @@ describe(' Ten @@ -1014,7 +1014,7 @@ describe('