Dialogs inform users about a task and can contain critical information, require decisions, or involve multiple tasks.
-A [Dialog](https://material.io/design/components/dialogs.html) is a type of [modal](/utils/modals) window that appears in front of app content to provide critical information or ask for a decision. Dialogs disable all app functionality when they appear, and remain on screen until confirmed, dismissed, or a required action has been taken. +A [Dialog](https://material.io/design/components/dialogs.html) is a type of [modal](/utils/modal) window that appears in front of app content to provide critical information or ask for a decision. Dialogs disable all app functionality when they appear, and remain on screen until confirmed, dismissed, or a required action has been taken. Dialogs are purposefully interruptive, so they should be used sparingly. diff --git a/docs/src/pages/guides/api/api.md b/docs/src/pages/guides/api/api.md index 85bff55b8ce7cc..7daadb4976d676 100644 --- a/docs/src/pages/guides/api/api.md +++ b/docs/src/pages/guides/api/api.md @@ -101,7 +101,7 @@ however, the `open` / `onClose` / `onOpen` combination is used for display relat ### boolean vs enum -There are a couple of way to the variants of a component: with a *boolean*; or with an *enum*. +There are two options to design the API for the variations of a component: with a *boolean*; or with an *enum*. For example, let's take a button that has different types. Each option has its pros and cons: - Option 1 *boolean*: diff --git a/docs/src/pages/utils/portal/portal.md b/docs/src/pages/utils/portal/portal.md index a6255d71d3664e..767cdfd66ebcb7 100644 --- a/docs/src/pages/utils/portal/portal.md +++ b/docs/src/pages/utils/portal/portal.md @@ -9,7 +9,7 @@ components: Portal The children of the portal component will be appended to the `container` specified. -The component is used internally by the [`Modal`](/utils/modals) component. +The component is used internally by the [`Modal`](/utils/modal) and [`Popper`](/utils/popper) components. On the server, the content won't be rendered. You have to wait for the client side reconciliation to see the children. diff --git a/packages/material-ui/src/Fade/Fade.js b/packages/material-ui/src/Fade/Fade.js index 07561f5a5c53d0..49144376b0cbd4 100644 --- a/packages/material-ui/src/Fade/Fade.js +++ b/packages/material-ui/src/Fade/Fade.js @@ -17,7 +17,7 @@ const styles = { }; /** - * The Fade transition is used by the [Modal](/utils/modals) component. + * The Fade transition is used by the [Modal](/utils/modal) component. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. */ class Fade extends React.Component { diff --git a/packages/material-ui/src/Grow/Grow.js b/packages/material-ui/src/Grow/Grow.js index cb6464636ea6ab..dd1420a9c00063 100644 --- a/packages/material-ui/src/Grow/Grow.js +++ b/packages/material-ui/src/Grow/Grow.js @@ -22,7 +22,8 @@ const styles = { }; /** - * The Grow transition is used by the [Popover](/utils/popovers) component. + * The Grow transition is used by the [Tooltip](/demos/tooltips) and + * [Popover](/utils/popover) components. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. */ class Grow extends React.Component { diff --git a/packages/material-ui/src/Modal/Modal.js b/packages/material-ui/src/Modal/Modal.js index da78b9cdc0252e..0a4e0d3bafe9ec 100644 --- a/packages/material-ui/src/Modal/Modal.js +++ b/packages/material-ui/src/Modal/Modal.js @@ -40,6 +40,9 @@ if (process.env.NODE_ENV !== 'production' && !React.createContext) { throw new Error('Material-UI: react@16.3.0 or greater is required.'); } +/** + * This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals). + */ class Modal extends React.Component { mountNode = null; diff --git a/packages/material-ui/src/Modal/ModalManager.js b/packages/material-ui/src/Modal/ModalManager.js index c969b9f36da5c1..4595618c3d5ff3 100644 --- a/packages/material-ui/src/Modal/ModalManager.js +++ b/packages/material-ui/src/Modal/ModalManager.js @@ -64,7 +64,7 @@ function removeContainerStyle(data, container) { * @ignore - do not document. * * Proper state managment for containers and the modals in those containers. - * Simplified, but inspired by react-overlay's ModalManager class + * Simplified, but inspired by react-overlay's ModalManager class. * Used by the Modal to ensure proper styling of containers. */ class ModalManager { diff --git a/packages/material-ui/src/Popper/Popper.js b/packages/material-ui/src/Popper/Popper.js index a2be105dd57db1..1adedec03a45c0 100644 --- a/packages/material-ui/src/Popper/Popper.js +++ b/packages/material-ui/src/Popper/Popper.js @@ -28,6 +28,9 @@ function getAnchorEl(anchorEl) { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; } +/** + * Poppers rely on the 3rd party library [Popper.js](https://github.com/FezVrasta/popper.js) for positioning. + */ class Popper extends React.Component { popper = null; diff --git a/pages/api/fade.md b/pages/api/fade.md index 660ceaf4eb80aa..2c5a7f0b4005f1 100644 --- a/pages/api/fade.md +++ b/pages/api/fade.md @@ -9,7 +9,7 @@ title: Fade APIThe API documentation of the Fade React component.
-The Fade transition is used by the [Modal](/utils/modals) component. +The Fade transition is used by the [Modal](/utils/modal) component. It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. ## Props diff --git a/pages/api/grow.md b/pages/api/grow.md index 3ce31130a56e27..c5ed67c183997c 100644 --- a/pages/api/grow.md +++ b/pages/api/grow.md @@ -9,7 +9,8 @@ title: Grow APIThe API documentation of the Grow React component.
-The Grow transition is used by the [Popover](/utils/popovers) component. +The Grow transition is used by the [Tooltip](/demos/tooltips) and +[Popover](/utils/popover) components. It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. ## Props diff --git a/pages/api/modal.md b/pages/api/modal.md index 6e1c3d2c893ab6..bcf6e26ffc7da0 100644 --- a/pages/api/modal.md +++ b/pages/api/modal.md @@ -9,7 +9,7 @@ title: Modal APIThe API documentation of the Modal React component.
- +This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals). ## Props diff --git a/pages/api/popper.md b/pages/api/popper.md index caba79a0d8ee8b..97cc861a300c5c 100644 --- a/pages/api/popper.md +++ b/pages/api/popper.md @@ -9,7 +9,7 @@ title: Popper APIThe API documentation of the Popper React component.
- +Poppers rely on the 3rd party library [Popper.js](https://github.com/FezVrasta/popper.js) for positioning. ## Props