import React from 'react'
import './styles/storybook.scss';
import '../src/styles/global.scss';

export const decorators = [
    (Story, context) => {
        const isContainerFluid =  context.parameters && context.parameters.container && context.parameters.container === 'fluid';
        const containerStyles = isContainerFluid ? { paddingLeft: 0, paddingRight: 0 } : {};
        const containerClass = isContainerFluid ? 'container-fluid': 'container';
        const rowClass = `row${isContainerFluid ? ' no-gutters' : ''}`;

        return (
            <div className={containerClass} style={containerStyles}>
                <div className={rowClass}>
                    <div className="col-12"><Story /></div>
                </div>
            </div>
        );
    }
];
export const parameters = {
    options: {
      storySort: {
        order: ['Intro','Docs', ['Getting Started', 'Customizations'],  'Styles', 'Atoms', 'Components', 'Composite Demos']
      },
    },
  };
