-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
9 changed files
with
286 additions
and
61 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import React from 'react'; | ||
| import { ButtonGroupProps } from './types'; | ||
|
|
||
| type ButtonContextType = { | ||
| parent?: ButtonGroupProps; | ||
| }; | ||
|
|
||
| const ButtonContext = React.createContext<ButtonContextType>({}); | ||
|
|
||
| export default ButtonContext; |
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,45 @@ | ||
| import React, { useContext } from 'react'; | ||
| import ConfigProviderContext from '../config-provider/config-provider-context'; | ||
| import ButtonContext from './button-context'; | ||
| import { useNamespace } from '../../hooks'; | ||
| import { joinTrim } from '../../utils'; | ||
| import { ButtonGroupProps } from './types'; | ||
|
|
||
| const ButtonGroup = (props: ButtonGroupProps) => { | ||
| const { shape = 'default', type = 'default' } = props; | ||
|
|
||
| const internalClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => { | ||
| if (props.disabled) return; | ||
| props.onClick?.(e); | ||
| }; | ||
|
|
||
| const { prefix } = useContext(ConfigProviderContext); | ||
| const ns = useNamespace('button', prefix); | ||
|
|
||
| return ( | ||
| <div | ||
| className={joinTrim([ | ||
| props.className, | ||
| ns.e('group'), | ||
| ns.em('group', type), | ||
| ns.em('group__shape', shape), | ||
| props.disabled ? ns.em('group', 'disabled') : '', | ||
| ])} | ||
| style={props.style} | ||
| onClick={internalClick} | ||
| > | ||
| <ButtonContext.Provider | ||
| value={{ | ||
| parent: { | ||
| ...props, | ||
| shape: 'square', | ||
| }, | ||
| }} | ||
| > | ||
| {props.children} | ||
| </ButtonContext.Provider> | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default ButtonGroup; |
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,29 @@ | ||
| import React from 'react'; | ||
| import { Button, Space, AuntIconArrowLeft, AuntIconArrowRight, AuntIconRefreshCcw } from 'aunt'; | ||
|
|
||
| export default () => ( | ||
| <Space direction='vertical'> | ||
| <Button.Group plain type='primary' shape='round' disabled> | ||
| <Button>按钮1</Button> | ||
| <Button>按钮2</Button> | ||
| <Button>按钮3</Button> | ||
| </Button.Group> | ||
| <Button.Group shape='round'> | ||
| <Button type='primary'>按钮1</Button> | ||
| <Button type='primary'>按钮2</Button> | ||
| <Button type='primary'>按钮3</Button> | ||
| </Button.Group> | ||
| <Button.Group type='success' shape='round'> | ||
| <Button type='success'>按钮1</Button> | ||
| <Button type='default'>按钮2</Button> | ||
| <Button type='success'>按钮3</Button> | ||
| </Button.Group> | ||
| <Button.Group shape='round'> | ||
| <Button icon={<AuntIconArrowLeft size={18} />}>上一步</Button> | ||
| <Button icon={<AuntIconRefreshCcw size={18} />}>刷新</Button> | ||
| <Button icon={<AuntIconArrowRight size={18} />} iconPosition='right'> | ||
| 下一步 | ||
| </Button> | ||
| </Button.Group> | ||
| </Space> | ||
| ); |
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 |
|---|---|---|
| @@ -1,7 +1,12 @@ | ||
| import './styles/index.less'; | ||
| import { Button } from './button'; | ||
| import { Button as _Button } from './button'; | ||
| import ButtonGroup from './button-group'; | ||
|
|
||
| export type { ButtonProps, ButtonType, ButtonSize, ButtonShape } from './types'; | ||
|
|
||
| const Button = Object.assign(_Button, { | ||
| Group: ButtonGroup, | ||
| }); | ||
|
|
||
| export { Button }; | ||
| export default Button; |
Oops, something went wrong.