yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Allow Button s to take action prop (#3204)

Browse Source 
* Add ability for NudeButton to take action+context

* Add example usage

* Refactor to ActionButton, convert another example

* Remove dupe label
This commit is contained in:
Tom Moor
2022-03-12 15:46:13 -08:00
committed by GitHub
parent d8104c6cb6
commit b7097654b5
7 changed files with 109 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app/components/NudeButton.tsx
View File

@@ -1,12 +1,18 @@
import styled from "styled-components";
import ActionButton, {
Props as ActionButtonProps,
} from "~/components/ActionButton";
const Button = styled.button.attrs((props) => ({
type: "type" in props ? props.type : "button",
}))<{
type Props = ActionButtonProps & {
width?: number;
height?: number;
size?: number;
}>`
type?: "button" | "submit" | "reset";
};
const StyledNudeButton = styled(ActionButton).attrs((props: Props) => ({
type: "type" in props ? props.type : "button",
}))<Props>`
width: ${(props) => props.width || props.size || 24}px;
height: ${(props) => props.height || props.size || 24}px;
background: none;
@@ -20,4 +26,4 @@ const Button = styled.button.attrs((props) => ({
color: inherit;
`;
export default Button;
export default StyledNudeButton;