GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-04 19:01:05 +08:00
Code Issues Packages Projects Releases Wiki Activity

CHANGE addon-events to use API instead of channel

Browse Source
This commit is contained in:
Norbert de Langen 2019-03-14 13:18:29 +01:00
parent 223ea4d318
commit 1a3607c4a6
2 changed files with 11 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
addons/events/src/components/Panel.js
View File

@ -16,10 +16,10 @@ const Wrapper = styled.div({
export default class EventsPanel extends Component { export default class EventsPanel extends Component {
static propTypes = { static propTypes = {
active: PropTypes.bool.isRequired, active: PropTypes.bool.isRequired,
channel: PropTypes.shape({ api: PropTypes.shape({
on: PropTypes.func,
emit: PropTypes.func, emit: PropTypes.func,
removeListener: PropTypes.func, off: PropTypes.func,
on: PropTypes.func,
}).isRequired, }).isRequired,
}; };
@ -28,15 +28,15 @@ export default class EventsPanel extends Component {
}; };
componentDidMount() { componentDidMount() {
const { channel } = this.props; const { api } = this.props;
channel.on(EVENTS.ADD, this.onAdd); api.on(EVENTS.ADD, this.onAdd);
} }
componentWillUnmount() { componentWillUnmount() {
const { channel } = this.props; const { api } = this.props;
channel.removeListener(EVENTS.ADD, this.onAdd); api.off(EVENTS.ADD, this.onAdd);
} }
onAdd = events => { onAdd = events => {
@ -44,9 +44,9 @@ export default class EventsPanel extends Component {
}; };
onEmit = event => { onEmit = event => {
const { channel } = this.props; const { api } = this.props;
channel.emit(EVENTS.EMIT, event); api.emit(EVENTS.EMIT, event);
}; };
render() { render() {

5
addons/events/src/manager.js
View File

@ -5,12 +5,11 @@ import Panel from './components/Panel';
import { ADDON_ID, PANEL_ID } from './constants'; import { ADDON_ID, PANEL_ID } from './constants';
export function register() { export function register() {
addons.register(ADDON_ID, () => { addons.register(ADDON_ID, api => {
const channel = addons.getChannel();
addons.addPanel(PANEL_ID, { addons.addPanel(PANEL_ID, {
title: 'Events', title: 'Events',
// eslint-disable-next-line react/prop-types // eslint-disable-next-line react/prop-types
render: ({ active, key }) => <Panel key={key} channel={channel} active={active} />, render: ({ active, key }) => <Panel key={key} api={api} active={active} />,
}); });
}); });
} }