import sizeLoader from './size';
import positionLoader from './position';
import rotationLoader from './rotation';
import opacityLoader from './opacity';
import responsiveLoader from './responsive';
import code from './code';
import name from './name';

import '../less/plugin-basic-traits.less';
import 'vue-slider-component/theme/default.css';

import { addTraits } from '../../../utils';

function loadBasicTraits(editor) {
  [sizeLoader, positionLoader, rotationLoader, opacityLoader, responsiveLoader, code, name].map(loader => loader(editor));
}

export const traitNameList = ['basic-traits-rotation', 'basic-traits-opacity', 'code'];

export default (grapesjs) => {
  grapesjs.plugins.add('plugin-sp-basicTraits', (editor, options) => {
    editor.on('component:mount', function (component) {
      if (!component.getTrait('id')) {
        if (component.getTrait('authorInfo')) {
          component.addTrait({ type: 'text', name: 'id' }, { at: 1 })
        } else {
          component.addTrait({ type: 'text', name: 'id' }, { at: 0 })
        }
      }
      addTraits(component, traitNameList.reverse());
    });

    loadBasicTraits(editor);
  });
}
