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

FIX issue with knobs and possibly more addons

Browse Source
This commit is contained in:
Norbert de Langen 2018-11-14 16:40:08 +01:00
parent a91b9be311
commit bae5a23a93
No known key found for this signature in database
GPG Key ID: 976651DA156C2825
6 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
addons/knobs/src/components/Panel.js
View File

@ -5,6 +5,7 @@ import { document } from 'global';
import styled from '@emotion/styled';
import copy from 'copy-to-clipboard';
import { STORY_CHANGED } from '@storybook/core-events';
import { Placeholder, TabWrapper, TabsState, ActionBar, ActionButton } from '@storybook/components';
import { RESET, SET, CHANGE, SET_OPTIONS, CLICK } from '../shared';
@ -37,11 +38,11 @@ export default class KnobPanel extends PureComponent {
channel.on(SET, this.setKnobs);
channel.on(SET_OPTIONS, this.setOptions);
this.stopListeningOnStory = api.onStory(() => {
this.stopListeningOnStory = api.on(STORY_CHANGED, () => {
if (this.mounted) {
this.setState({ knobs: {} });
this.setKnobs({ knobs: {} });
}
channel.emit(RESET);
this.setKnobs({ knobs: {} });
});
}

2
addons/knobs/src/index.js
View File

@ -87,9 +87,9 @@ export const withKnobs = makeDecorator({
const storyOptions = parameters || options;
const allOptions = { ...defaultOptions, ...storyOptions };
manager.setOptions(allOptions);
const channel = addons.getChannel();
manager.setChannel(channel);
manager.setOptions(allOptions);
channel.emit(SET_OPTIONS, allOptions);
registerKnobs();

9
addons/knobs/src/registerKnobs.js
View File

@ -1,5 +1,6 @@
import addons from '@storybook/addons';
import Events from '@storybook/core-events';
import { STORY_CHANGED, FORCE_RE_RENDER, REGISTER_SUBSCRIPTION } from '@storybook/core-events';
import KnobManager from './KnobManager';
import { CHANGE, CLICK, RESET, SET } from './shared';
@ -7,7 +8,7 @@ export const manager = new KnobManager();
const { knobStore } = manager;
function forceReRender() {
addons.getChannel().emit(Events.FORCE_RE_RENDER);
addons.getChannel().emit(FORCE_RE_RENDER);
}
function setPaneKnobs(timestamp = +new Date()) {
@ -45,6 +46,7 @@ function disconnectCallbacks() {
const channel = addons.getChannel();
channel.removeListener(CHANGE, knobChanged);
channel.removeListener(CLICK, knobClicked);
channel.removeListener(STORY_CHANGED, resetKnobs);
channel.removeListener(RESET, resetKnobs);
knobStore.unsubscribe(setPaneKnobs);
}
@ -53,6 +55,7 @@ function connectCallbacks() {
const channel = addons.getChannel();
channel.on(CHANGE, knobChanged);
channel.on(CLICK, knobClicked);
channel.on(STORY_CHANGED, resetKnobs);
channel.on(RESET, resetKnobs);
knobStore.subscribe(setPaneKnobs);
@ -60,5 +63,5 @@ function connectCallbacks() {
}
export function registerKnobs() {
addons.getChannel().emit(Events.REGISTER_SUBSCRIPTION, connectCallbacks);
addons.getChannel().emit(REGISTER_SUBSCRIPTION, connectCallbacks);
}

1
lib/core-events/index.js
View File

@ -7,6 +7,7 @@ module.exports = {
SELECT_STORY: 'selectStory',
APPLY_SHORTCUT: 'applyShortcut',
STORY_ADDED: 'storyAdded',
STORY_CHANGED: 'storyChanged',
FORCE_RE_RENDER: 'forceReRender',
REGISTER_SUBSCRIPTION: 'registerSubscription',
STORY_INIT: 'storyInit',

4
lib/core/src/client/preview/start.js
View File

@ -129,6 +129,10 @@ export default function start(render, { decorateStory } = {}) {
document.documentElement.scrollTop = 0;
}
if (!forceRender) {
addons.getChannel().emit(Events.STORY_CHANGED, storyStore.getSelection().id);
}
render({
...context,
story,

4
lib/ui/src/core/init-provider-api.js
View File

@ -1,6 +1,6 @@
import qs from 'qs';
import { STORY_RENDERED } from '@storybook/core-events';
import { STORY_CHANGED } from '@storybook/core-events';
export default ({ provider, api, store, eventHandler }) => {
provider.handleAPI({
@ -22,7 +22,7 @@ export default ({ provider, api, store, eventHandler }) => {
// TODO deprecate this
onStory(cb) {
return this.on(STORY_RENDERED, cb);
return this.on(STORY_CHANGED, cb);
},
...api,