Skip to content

Commit

Permalink
Merge pull request #423 from youluna/test/a11y
Browse files Browse the repository at this point in the history 
Balloon  deprecated triggerType="focus"
  • Loading branch information
@myronliu347
myronliu347 committed Mar 12, 2019
2 parents f52c5c2 + 157a233 commit 277de7e
Show file tree
Hide file tree
Showing 14 changed files with 738 additions and 581 deletions.
17 changes: 12 additions & 5 deletions docs/balloon/demo/accessibility.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
- order: 7

弹层id, 传入值才会支持无障碍。

:::lang=en-us

id of popup. only when you set value, balloon will support accessibility.
id of popup. only when you set value, balloon will support accessibility.

# Addon

Expand All @@ -19,12 +19,19 @@ id of popup. only when you set value, balloon will support accessibility.

import { Button, Balloon } from '@alifd/next';

const ClickTarget = <Button style={{margin: '5px'}}>click</Button>;
const { Tooltip } = Balloon;

const triggerBallon = <Button style={{margin: '5px'}}>show balloon</Button>;
const triggerTooltip = <Button style={{margin: '5px'}}>show tooltip</Button>;
const Demo = () => (
<div className="container">
<Balloon trigger={ClickTarget} triggerType="click" id="aria">
<p > content </p>
<Balloon trigger={triggerBallon} triggerType="click" id="aria-balloon">
<p>This is content for balloon</p>
</Balloon>

<Tooltip trigger={triggerTooltip} id="aria-tooltip">
<p>This is content for tooltip.</p>
</Tooltip>
</div>
);

Expand Down
5 changes: 3 additions & 2 deletions docs/balloon/index.en-us.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
### Note

- When trigger is a custom React Component, it needs to pass through the onMouseEnter/onMouseLeave/onClick callback.
- This Component will be accessible when you pass id. We recommond you `<Tooltip>` for simple tip, `<Balloon triggerType="click">` for complex usage(e.g.nested with form). Don't use triggerType="focus", it's for Component internal use only.

## API

Expand All @@ -33,7 +34,7 @@
| align | position of popup relative to the trigger<br><br>**option**:<br>'t'(top)<br>'r'(right)<br>'b'(bottom)<br>'l'(left)<br>'tl'(top left)<br>'tr'(top right)<br>'bl'(bottom left)<br>'br'(bottom right)<br>'lt'(left top)<br>'lb'(left bottom)<br>'rt'(right top)<br>'rb'(right bottom) or their combinations | Enum | 'b' |
| offset | offset for fine tuning the popup | Array | [0, 0] |
| trigger | trigger of the popup | any | &lt;span>&lt;/span> |
| triggerType | how to trigger the popup. <br><br>**type unit**:<br>'hover'<br>'focus'<br>'click'<br> e.g.['hover', 'focus'] 'click' | String/Array | 'hover' |
| triggerType | how to trigger the popup. <br><br>**type unit**:<br>'hover'<br>'click'<br> e.g.['hover', 'click'] 'click' | String/Array | 'hover' |
| onClose | callback triggered when visible becomes false<br><br>**signature**:<br>Function() => void | Function | func.noop |
| needAdjust | whether to adjust the position automatically | Boolean | false |
| delay | how long should the popup be delayed after triggered in milliseconds | Number | - |
Expand All @@ -57,7 +58,7 @@
| children | content of tooltip | any | - |
| align | position of popup relative to the trigger<br><br>**option**:<br>'t'(top)<br>'r'(right)<br>'b'(bottom)<br>'l'(left)<br>'tl'(top left)<br>'tr'(top right)<br>'bl'(bottom left)<br>'br'(bottom right)<br>'lt'(left top)<br>'lb'(left bottom)<br>'rt'(right top)<br>'rb'(right bottom) or their combinations | Enum | 'b' |
| trigger | trigger of the tooltip | any | &lt;span>&lt;/span> |
| triggerType | how to trigger the tooltip. <br><br>**type unit**:<br>'hover'<br>'focus'<br>'click'<br> e.g.['hover', 'focus'] 'click' | String/Array | 'hover' |
| triggerType | how to trigger the tooltip. <br><br>**type unit**:<br>'hover'<br>'click'<br> e.g.['hover', 'click'] 'click'. `<Balloon triggerType="click">` for complex usage | String/Array | 'hover' |
| popupStyle | custom style of popup | Object | - |
| popupClassName | custom className of popup | String | - |
| popupProps | props of popup | Object | - |
Expand Down

0 comments on commit 277de7e

Please sign in to comment.