TypeScript addons.makeDecorator函数代码示例

import { makeDecorator, StoryContext, StoryGetter } from '@storybook/addons';
import deprecate from 'util-deprecate';

// This decorator is kept purely so we produce a decorator that is compatible with both
// `addDecorator(withBackgrounds(...))` and `addDecorator(withBackgrounds)`
export const withBackgrounds = deprecate(
  makeDecorator({
    name: 'withBackgrounds',
    parameterName: 'backgrounds',
    wrapper: (getStory: StoryGetter, context: StoryContext) => {
      return getStory(context);
    },
  }),
  `Note that withBackgrounds(options) has been replaced by addParameters({ backgrounds: options})
Read more about it in the migration guide: https://github.com/storybooks/storybook/blob/master/MIGRATION.md`
);

if (module && module.hot && module.hot.decline) {
  module.hot.decline();
}

    const { id, code } = r;
    updateElement(id, code, true);
  });
  removed.forEach(r => {
    const { id, code } = r;
    updateElement(id, code, false);
  });
};

export const withCssResources = makeDecorator({
  name: 'withCssResources',
  parameterName: PARAM_KEY,
  skipIfNoParametersOrOptions: true,
  allowDeprecatedUsage: false,

  wrapper: (getStory: any, context: any, { options, parameters }: any) => {
    const storyOptions = parameters || options;
    addons.getChannel().on(EVENTS.SET, setResources);

    if (!Array.isArray(storyOptions) && !Array.isArray(storyOptions.cssresources)) {
      throw new Error('The `cssresources` parameter needs to be an Array');
    }

    return getStory(context);
  },
});

if (module && module.hot && module.hot.decline) {
  module.hot.decline();
}

import addons, { makeDecorator } from "@storybook/addons";
import { addDecorator, storiesOf } from "@storybook/react";

// Example from Storybook documentation
const withNotes = makeDecorator({
    name: "withNotes",
    parameterName: "notes",
    wrapper: (getStory, context, {options, parameters}: {options: number, parameters: string}) => {
        const channel = addons.getChannel();
        channel.emit("MYADDON/add_notes", parameters);
        return getStory(context);
    }
});

// new style
addDecorator(withNotes);

// old style, but still supported
addDecorator(withNotes(42));

// the deprecated style actually isn't supported by
// @storybook/react's typings, so, no test for that...
storiesOf("Hello", module)
    .addDecorator(withNotes)        // new style
    .addDecorator(withNotes(42));   // old style, but still supported

import { makeDecorator, StoryContext, StoryGetter, WrapperSettings } from '@storybook/addons';
import deprecate from 'util-deprecate';

// todo resolve any after @storybook/addons and @storybook/channels are migrated to TypeScript
export const withNotes = makeDecorator({
  name: 'withNotes',
  parameterName: 'notes',
  skipIfNoParametersOrOptions: true,
  allowDeprecatedUsage: true,

  wrapper: deprecate((getStory: StoryGetter, context: StoryContext, { options, parameters }: WrapperSettings) => {
    const storyOptions = parameters || options;

    const { text, markdown } =
      typeof storyOptions === 'string'
        ? {
            text: storyOptions,
            markdown: undefined,
          }
        : storyOptions;

    if (!text && !markdown) {
      throw new Error(`Parameter 'notes' must must be a string or an object with 'text' or 'markdown' properties`);
    }

    return getStory(context);
  }, 'withNotes is deprecated'),
});

export const withMarkdownNotes = deprecate((text: string, options: any) => {}, 'withMarkdownNotes is deprecated');

if (module && module.hot && module.hot.decline) {