make react-burger-menu styles prop use Partial (#43074)

This commit is contained in:
Carl Egbert
2020-03-12 18:19:13 -07:00
committed by GitHub
parent 7a5d27becf
commit b6e672ed63
2 changed files with 34 additions and 35 deletions

View File

@@ -6,7 +6,7 @@
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 2.8
import * as React from "react";
import * as React from 'react';
export interface State {
isOpen: boolean;
@@ -55,19 +55,19 @@ export interface Props {
// styles && styles.pageWrap ? PropTypes.string.isRequired : PropTypes.string,
pageWrapId?: string;
right?: boolean;
styles?: Styles;
styles?: Partial<Styles>;
width?: number | string;
}
export class ReactBurgerMenu extends React.Component<Props> { }
export class ReactBurgerMenu extends React.Component<Props> {}
export class slide extends ReactBurgerMenu { }
export class stack extends ReactBurgerMenu { }
export class elastic extends ReactBurgerMenu { }
export class bubble extends ReactBurgerMenu { }
export class push extends ReactBurgerMenu { }
export class pushRotate extends ReactBurgerMenu { }
export class scaleDown extends ReactBurgerMenu { }
export class scaleRotate extends ReactBurgerMenu { }
export class fallDown extends ReactBurgerMenu { }
export class reveal extends ReactBurgerMenu { }
export class slide extends ReactBurgerMenu {}
export class stack extends ReactBurgerMenu {}
export class elastic extends ReactBurgerMenu {}
export class bubble extends ReactBurgerMenu {}
export class push extends ReactBurgerMenu {}
export class pushRotate extends ReactBurgerMenu {}
export class scaleDown extends ReactBurgerMenu {}
export class scaleRotate extends ReactBurgerMenu {}
export class fallDown extends ReactBurgerMenu {}
export class reveal extends ReactBurgerMenu {}

View File

@@ -2,28 +2,27 @@ import * as React from 'react';
import { slide as Menu, State } from 'react-burger-menu';
class Example extends React.Component {
showSettings(event: {
preventDefault(): void;
}) {
event.preventDefault();
}
showSettings(event: { preventDefault(): void }) {
event.preventDefault();
}
render() {
return (
<Menu
customBurgerIcon={<img src="img/icon.svg" />}
customCrossIcon={<img src="img/icon.svg" />}
onStateChange={this.onStateChange}
>
<a id="home" className="menu-item" href="/">Home</a>
<a id="about" className="menu-item" href="/about">About</a>
<a id="contact" className="menu-item" href="/contact">Contact</a>
<a onClick={this.showSettings} className="menu-item--small" href="">Settings</a>
</Menu>
);
}
render() {
return (
<Menu
customBurgerIcon={<img src="img/icon.svg" />}
customCrossIcon={<img src="img/icon.svg" />}
onStateChange={this.onStateChange}
styles={{}}
>
<a id="home" className="menu-item" href="/">Home</a>
<a id="about" className="menu-item" href="/about">About</a>
<a id="contact" className="menu-item" href="/contact">Contact</a>
<a onClick={this.showSettings} className="menu-item--small" href="">Settings</a>
</Menu>
);
}
onStateChange = (state: State): void => {
console.log(state.isOpen);
}
onStateChange = (state: State): void => {
console.log(state.isOpen);
}
}