Skip to content

Commit

Permalink
refactor(overlay): refactored Overlay related components (rsuite#1266)
Browse files Browse the repository at this point in the history 
* refactor(overlay): refactored Overlay related components

* refactor: update components affected by Overlay
  • Loading branch information
@simonguo
simonguo authored Sep 2, 2020
1 parent 0f06bbc commit c9ff924
Show file tree
Hide file tree
Showing 255 changed files with 4,603 additions and 6,923 deletions.
9 changes: 6 additions & 3 deletions docs/components/LanguageButton/LanguageButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ interface ButtonProps {
[key: string]: any;
}

function LanguageButton(props: ButtonProps) {
const LanguageButton = React.forwardRef((props: ButtonProps, ref) => {
const router = useRouter();
const { language, onChangeLanguage } = React.useContext(AppContext);
const { className, ...rest } = props;
Expand All @@ -27,19 +27,22 @@ function LanguageButton(props: ButtonProps) {

router.push(pathname, `${languageToPath(nextLanguage)}${pathname}`);
},
[language]
[onChangeLanguage, router, isZH]
);

return (
<Button
{...rest}
ref={ref}
className={classnames('btn-switch-language', className)}
appearance="subtle"
onClick={handleChangeLanguage}
>
<Icon icon={SvgIcons.Language} /> {isZH ? 'English' : '中文'}
</Button>
);
}
});

LanguageButton.displayName = 'LanguageButton';

export default LanguageButton;
2 changes: 2 additions & 0 deletions docs/pages/components/affix/zh-CN/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@

容器在可视范围内才固定元素，当滚动页面容器不在可视范围则取消固定元素。

<!--{include:`container.md`}-->

## Props

### `<Affix>`
Expand Down
71 changes: 0 additions & 71 deletions docs/pages/components/drawer/en-US/backdrop.md
View file

This file was deleted.

53 changes: 0 additions & 53 deletions docs/pages/components/drawer/en-US/basic.md
View file

This file was deleted.

70 changes: 0 additions & 70 deletions docs/pages/components/drawer/en-US/full.md
View file

This file was deleted.

70 changes: 44 additions & 26 deletions docs/pages/components/drawer/en-US/index.md
View file
Original file line number Diff line number Diff line change
@@ -1,38 +1,56 @@
# Drawer

A floating layer that slides out from the edge of the page can be used instead of Modal to put more content.
A panel that slides out from the edge of the page can replace Modal to present more content.

## Usage
## Import

```js
import { Drawer } from 'rsuite';
```
<!--{include:(components/drawer/fragments/import.md)}-->

## Examples

<!--{demo}-->
### Default

<!--{include:`basic.md`}-->

### Backdrop

<!--{include:`backdrop.md`}-->

### Placement

<!--{include:`placement.md`}-->

### Size

<!--{include:`size.md`}-->

### Fullpage

<!--{include:`full.md`}-->

## Props

<!--{include:(_common/types/placement4.md)}-->

### `<Drawer>`

| Property | Type `(Default)` | Description |
| ----------------- | ---------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| autoFocus | boolean `(true)` | When set to true, the Drawer is opened and is automatically focused on its own, accessible to screen readers |
| backdrop | unions: boolean, 'static' | When set to true, the Drawer will display the background when it is opened. Clicking on the background will close the Drawer. If you do not want to close the Drawer, set it to 'static'. |
| backdropClassName | string | Add an optional extra class name to .modal-backdrop It could end up looking like class="modal-backdrop foo-modal-backdrop in". |
| classPrefix | string `('drawer')` | The prefix of the component CSS class |
| enforceFocus | boolean `(true)` | When set to true, Drawer will prevent the focus from leaving when opened, making it easier for the secondary screen reader to access |
| full | boolean | Full screen |
| keyboard | boolean | close Drawer when press `esc` |
| onEnter | () => void | Callback fired before the Drawer transitions in |
| onEntered | () => void | Callback fired after the Drawer finishes transitioning in |
| onEntering | () => void | Callback fired as the Drawer begins to transition in |
| onExit | () => void | Callback fired right before the Drawer transitions out |
| onExited | () => void | Callback fired after the Drawer finishes transitioning out |
| onExiting | () => void | Callback fired as the Drawer begins to transition out |
| onHide | () => void | Callback fired when Drawer hide |
| onShow | () => void | Callback fired when Drawer display |
| placement | enum: 'top','right','bottom', 'left' `(right)` | The placement of Drawer |
| show \* | boolean | Show Drawer |
| size | enum: 'lg', 'md', 'sm', 'xs' | Set Drawer size |
| Property | Type `(Default)` | Description |
| ----------------- | ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| autoFocus | boolean `(true)` | When set to true, the Drawer is opened and is automatically focused on its own, accessible to screen readers |
| backdrop | unions: boolean, 'static' | When set to true, the Drawer will display the background when it is opened. Clicking on the background will close the Drawer. If you do not want to close the Drawer, set it to 'static'. |
| backdropClassName | string | Add an optional extra class name to .modal-backdrop It could end up looking like class="modal-backdrop foo-modal-backdrop in". |
| classPrefix | string `('drawer')` | The prefix of the component CSS class |
| enforceFocus | boolean `(true)` | When set to true, Drawer will prevent the focus from leaving when opened, making it easier for the secondary screen reader to access |
| full | boolean | Full screen |
| keyboard | boolean | close Drawer when press `esc` |
| onEnter | () => void | Callback fired before the Drawer transitions in |
| onEntered | () => void | Callback fired after the Drawer finishes transitioning in |
| onEntering | () => void | Callback fired as the Drawer begins to transition in |
| onExit | () => void | Callback fired right before the Drawer transitions out |
| onExited | () => void | Callback fired after the Drawer finishes transitioning out |
| onExiting | () => void | Callback fired as the Drawer begins to transition out |
| onClose | () => void | Callback fired when Drawer hide |
| onOpen | () => void | Callback fired when Drawer display |
| placement | Placement `(right)` | The placement of Drawer |
| open \* | boolean | Open Drawer |
| size | enum: 'lg', 'md', 'sm', 'xs' | Set Drawer size |
68 changes: 0 additions & 68 deletions docs/pages/components/drawer/en-US/placement.md
View file

This file was deleted.

Loading

0 comments on commit c9ff924

Please sign in to comment.