How to use the @storybook/aurelia.addComponents function in @storybook/aurelia

import { withKnobs, text } from '@storybook/addon-knobs';
import { action } from '@storybook/addon-actions';
import { addComponents, storiesOf } from '@storybook/aurelia';
import { CoolButton } from '../cool-button/cool-button';
import 'bootstrap/scss/bootstrap.scss';

storiesOf('Button|Basic', module)
  .addDecorator(withKnobs)
  .addDecorator(addComponents(CoolButton))
  .add('Aurelia - Template', function () {
    const buttonText = text('Button Text', 'Aurelia Rocks!');
    const buttonClick = action('Button Click');
    const state = {
      buttonText,
      buttonClick,
    };
    return {
      template: `<template></template>`,
      state,
    };
  })
  .add('Aurelia - Auto Generate', function () {
    return {
      customElement: CoolButton,
    };

import { withKnobs, text } from '@storybook/addon-knobs';
import { linkTo } from '@storybook/addon-links';
import { addComponents, storiesOf } from '@storybook/aurelia';
import { CoolButton } from '../cool-button/cool-button';
import 'bootstrap/scss/bootstrap.scss';

storiesOf('Link|Basic', module)
  .addDecorator(withKnobs)
  .addDecorator(addComponents(CoolButton))
  .add('Aurelia - Template', function () {
    const buttonLink = linkTo('Button|Basic');
    return {
      template: `<button class="btn btn-outline-dark">GO TO BUTTONS</button>`,
      state: {
        buttonLink,
      },
    };
  });