UNPKG

2.6 kBJavaScriptView Raw
1import "core-js/modules/es.function.name.js";
2import addons from '@storybook/addons';
3import { useEffect } from '@storybook/client-api';
4import { STORY_CHANGED, FORCE_RE_RENDER } from '@storybook/core-events';
5import debounce from 'lodash/debounce';
6import KnobManager from './KnobManager';
7import { CHANGE, CLICK, RESET, SET } from './shared';
8export var manager = new KnobManager();
9var knobStore = manager.knobStore;
10var COMPONENT_FORCE_RENDER_DEBOUNCE_DELAY_MS = 325;
11
12function forceReRender() {
13 addons.getChannel().emit(FORCE_RE_RENDER);
14}
15
16function setPaneKnobs() {
17 var timestamp = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : +new Date();
18 var channel = addons.getChannel();
19 channel.emit(SET, {
20 knobs: knobStore.getAll(),
21 timestamp: timestamp
22 });
23}
24
25var resetAndForceUpdate = function resetAndForceUpdate() {
26 knobStore.markAllUnused();
27 forceReRender();
28}; // Increase performance by reducing how frequently the story is recreated during knob changes
29
30
31var debouncedResetAndForceUpdate = debounce(resetAndForceUpdate, COMPONENT_FORCE_RENDER_DEBOUNCE_DELAY_MS);
32
33function knobChanged(change) {
34 var name = change.name;
35 var value = change.value; // Update the related knob and it's value.
36
37 var knobOptions = knobStore.get(name);
38 knobOptions.value = value;
39
40 if (!manager.options.disableForceUpdate && !knobOptions.disableForceUpdate) {
41 if (!manager.options.disableDebounce && !knobOptions.disableDebounce) {
42 debouncedResetAndForceUpdate();
43 } else {
44 resetAndForceUpdate();
45 }
46 }
47}
48
49function knobClicked(clicked) {
50 var knobOptions = knobStore.get(clicked.name);
51
52 if (knobOptions.callback && knobOptions.callback() !== false) {
53 forceReRender();
54 }
55}
56
57function resetKnobs() {
58 knobStore.reset();
59 setPaneKnobs(false);
60}
61
62function resetKnobsAndForceReRender() {
63 knobStore.reset();
64 forceReRender();
65 setPaneKnobs(false);
66}
67
68function disconnectCallbacks() {
69 var channel = addons.getChannel();
70 channel.removeListener(CHANGE, knobChanged);
71 channel.removeListener(CLICK, knobClicked);
72 channel.removeListener(STORY_CHANGED, resetKnobs);
73 channel.removeListener(RESET, resetKnobsAndForceReRender);
74 knobStore.unsubscribe(setPaneKnobs);
75}
76
77function connectCallbacks() {
78 var channel = addons.getChannel();
79 channel.on(CHANGE, knobChanged);
80 channel.on(CLICK, knobClicked);
81 channel.on(STORY_CHANGED, resetKnobs);
82 channel.on(RESET, resetKnobsAndForceReRender);
83 knobStore.subscribe(setPaneKnobs);
84 return disconnectCallbacks;
85}
86
87export function registerKnobs() {
88 useEffect(connectCallbacks, []);
89}
\No newline at end of file