text: import { addParameters, configure, addDecorator } from '@storybook/vue';
  import Vue from 'vue';
  import Vuex from 'vuex';
  import VueI18n from 'vue-i18n';
  import VueRouter from 'vue-router';
  import VueCompositionApi from '@vue/composition-api';
  import { checkA11y } from '@storybook/addon-a11y';
  import { setDefaults, withInfo } from 'storybook-addon-vue-info';
  import { action } from '@storybook/addon-actions';
  import '@storybook/addon-console';
  import '../../src/assets/_design-system.scss';
  import '../../src/assets/reset.scss';
  import '../../src/assets/global.scss';
  import '@/assets/typography.scss';
  import customTheme from './theme';
  import { extend } from 'vee-validate';
  import { required, email, integer, min, regex } from 'vee-validate/dist/rules.umd.js';
  
  extend('required', required);
  extend('email', email);
  extend('integer', integer);
  extend('min', min);
  extend('regex', regex);
  
  Vue.use(Vuex);
  Vue.use(VueI18n);
  Vue.use(VueRouter);
  Vue.use(VueCompositionApi);
  
  Vue.component('nuxt-link', {
    props: ['to'],
    methods: {
      log() {
        action('link target')(this.to);
      },
    },
    template: '<a href="#" @click.prevent="log()"><slot>NuxtLink</slot></a>',
  });
  Vue.mixin({
    created() {
      this.localePath = (path) => path;
    },
  });
  
  const req = require.context('../../src', true, /.stories.ts$/);
  
  const loadStories = () => {
    req.keys().forEach((filename) => req(filename));
  };
  
  addParameters(checkA11y);
  
  addParameters({
    options: {
      theme: customTheme,
    },
    viewport: {
      viewports: {
        phone: {
          name: 'Phone',
          styles: {
            width: '360px',
            height: '740px',
          },
        },
        tabletPortrait: {
          name: 'Tablet Portrait',
          styles: {
            width: '768px',
            height: '1024px',
          },
        },
        tabletLandscape: {
          name: 'Tablet Landscape',
          styles: {
            width: '1024px',
            height: '768px',
          },
        },
        smallDesktop: {
          name: 'Small Desktop',
          styles: {
            width: '1280px',
            height: '800px',
          },
        },
        largeDesktop: {
          name: 'Large Desktop',
          styles: {
            width: '1440px',
            height: '900px',
          },
        },
      },
    },
    themeSwitcher: {
      themes: [
        { label: 'Light Theme', value: 'light' },
        { label: 'Dark Theme', value: 'dark' },
      ],
    },
  });
  
  addDecorator(require('storybook-vue-router').default());
  addDecorator(withInfo);
  setDefaults({
    header: false,
    docsInPanel: true,
    useDocgen: false,
    source: false,
    casing: {
      props: 'camel',
      component: 'kebab',
    },
  });
  
  configure(loadStories, module);
  