Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Feat/fab/exited #661

Merged
merged 7 commits into from
Feb 8, 2019
Merged

Feat/fab/exited #661

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
8629476
fix(chips): ChipSet no longer overwrites handle[Interaction|Select|Re…
mgr34 Jan 31, 2019
2fc7bb7
fix: add tests
Feb 6, 2019
8a8c6f8
feat(fab): adds exited property and extends React.ButtonHTMLAttribute…
mgr34 Feb 6, 2019
054bd86
Merge remote-tracking branch 'origin/rc0.10.0' into feat/fab/exited
mgr34 Feb 6, 2019
7cbc8bd
feat(fab): update golden
mgr34 Feb 7, 2019
10212c6
Merge branch 'rc0.10.0' into feat/fab/exited
Feb 7, 2019
54ac50d
Update golden.json
Feb 7, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 2 additions & 1 deletion packages/fab/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,8 @@ The Fab can be used with the `span`, `i`, `img` or `svg` elements. It can also b
Prop Name | Type | Description
--- | --- | ---
className | String | Classes to be applied to the root element.
mini | n/a | Enables the mini variant.
exited | Boolean | When true animates the FAB out of view. When this false, the FAB will return to view.
mini | Boolean | Enables the mini variant.
icon | Element | The icon.
textLabel | String | The label, which makes the FAB extended.

Expand Down
18 changes: 11 additions & 7 deletions packages/fab/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,15 @@ import * as React from 'react';
import * as classnames from 'classnames';
import * as Ripple from '@material/react-ripple';

export interface FabProps extends Ripple.InjectedProps<HTMLButtonElement> {
mini?: boolean;
icon?: React.ReactElement<HTMLElement>;
textLabel?: string;
className?: string;
initRipple: React.Ref<HTMLButtonElement>;
unbounded: boolean;
export interface FabProps extends Ripple.InjectedProps<HTMLButtonElement>,
React.ButtonHTMLAttributes<HTMLButtonElement> {
exited?: boolean;
mini?: boolean;
icon?: React.ReactElement<HTMLElement>;
textLabel?: string;
className?: string;
initRipple: React.Ref<HTMLButtonElement>;
unbounded: boolean;
}

const Icon: React.FunctionComponent<{icon?: React.ReactElement<HTMLElement>}> = ({icon}) => {
Expand All @@ -54,6 +56,7 @@ const TextLabel: React.FunctionComponent<{textLabel: string}> = ({

export const Fab: React.FunctionComponent<FabProps & React.HTMLProps<HTMLButtonElement>> = ({
/* eslint-disable react/prop-types */
exited = false,
mini = false,
icon,
textLabel = '',
Expand All @@ -67,6 +70,7 @@ export const Fab: React.FunctionComponent<FabProps & React.HTMLProps<HTMLButtonE
const classes = classnames('mdc-fab', className, {
'mdc-fab--mini': mini,
'mdc-fab--extended': extended,
'mdc-fab--exited': exited,
});

return (
Expand Down