import { setup } from '@storybook/vue3';

import '../src/assets/styles/global.scss';
import { storybookRouter } from './router.js';

setup((app) => {
  app.use(storybookRouter);
});

export const globalTypes = {
  theme: {
    description: 'Global color theme',
    defaultValue: 'light',
    toolbar: {
      icon: 'paintbrush',
      items: ['light', 'dark'],
      dynamicTitle: true,
    },
  },
};

export const decorators = [
  (story, context) => {
    document.documentElement.dataset.theme = context.globals.theme;
    return story();
  },
];

export const parameters = {
  controls: { expanded: true },
  a11y: { test: 'error' },
  layout: 'fullscreen',
};