forked from mui/material-ui
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Rename `LeftNav` component to `Drawer` to better reflect the MD Spec and broader use cases than navigation. Also rename `openRight` propery to `openSecondary` to make RTL use less confusing. Update docs site examples to use the new component, and update wording. Rename docs site `AppLeftNav` to `AppNavDrawer`, and rename all internal functions. Closes mui#2697.
- Loading branch information
1 parent
0c35504
commit 3c96f0d
Showing
19 changed files
with
160 additions
and
164 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| import React from 'react'; | ||
| import Title from 'react-title-component'; | ||
|
|
||
| import CodeExample from '../../../CodeExample'; | ||
| import PropTypeDescription from '../../../PropTypeDescription'; | ||
| import MarkdownElement from '../../../MarkdownElement'; | ||
|
|
||
| import drawerReadmeText from './README'; | ||
| import DrawerSimpleExample from './ExampleSimple'; | ||
| import drawerSimpleExampleCode from '!raw!./ExampleSimple'; | ||
| import DrawerUndockedExample from './ExampleUndocked'; | ||
| import drawerUndockedExampleCode from '!raw!./ExampleUndocked'; | ||
| import DrawerOpenRightExample from './ExampleOpenRight'; | ||
| import drawerOpenRightExampleCode from '!raw!./ExampleOpenRight'; | ||
| import drawerCode from '!raw!material-ui/lib/Drawer/Drawer'; | ||
|
|
||
| const descriptions = { | ||
| simple: 'A simple controlled `Drawer`. The Drawer is `docked` by default, ' + | ||
| 'remaining open unless closed through the `open` prop.', | ||
| undocked: 'An undocked controlled `Drawer` with custom width. ' + | ||
| 'The Drawer can be cancelled by clicking the overlay or pressing the Esc key. ' + | ||
| 'It closes when an item is selected, handled by controlling the `open` prop.', | ||
| right: 'The `openSecondary` prop allows the Drawer to open on the opposite side.', | ||
| }; | ||
|
|
||
| const DrawerPage = () => ( | ||
| <div> | ||
| <Title render={(previousTitle) => `Drawer - ${previousTitle}`} /> | ||
| <MarkdownElement text={drawerReadmeText} /> | ||
| <CodeExample | ||
| title="Docked example" | ||
| description={descriptions.simple} | ||
| code={drawerSimpleExampleCode} | ||
| > | ||
| <DrawerSimpleExample /> | ||
| </CodeExample> | ||
| <CodeExample | ||
| title="Undocked example" | ||
| description={descriptions.undocked} | ||
| code={drawerUndockedExampleCode} | ||
| > | ||
| <DrawerUndockedExample /> | ||
| </CodeExample> | ||
| <CodeExample | ||
| title="Open on right" | ||
| description={descriptions.right} | ||
| code={drawerOpenRightExampleCode} | ||
| > | ||
| <DrawerOpenRightExample /> | ||
| </CodeExample> | ||
| <PropTypeDescription code={drawerCode} /> | ||
| </div> | ||
| ); | ||
|
|
||
| export default DrawerPage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| ## Drawer | ||
|
|
||
| The [Drawer](https://www.google.com/design/spec/patterns/navigation-drawer.html) slides in from the side. | ||
| It is a common pattern found in Google apps and follows the keylines and metrics for lists. | ||
|
|
||
| There are no examples for uncontrolled mode because an uncontrolled `Drawer` can only be opened with a swipe. | ||
| The doc site has an uncontrolled `Drawer`. Swipe from the left on a touch device to see it. | ||
|
|
||
| ### Examples |
Oops, something went wrong.