import { atom } from 'recoil';
import { ThemeColors, typography } from '../styles/theme';
import { IColors, IColorsSettings, ITypography } from '../types/theme';

const colorsSettings = atom<IColors>({
  key: 'colors',
  default: ThemeColors,
});

const droppedId = atom<string>({
  key: 'droppedId',
  default: '790',
});

const eventsToSpaces = atom<any>({
  key: 'eventsToSpaces',
  default: {},
});

const events = atom<any>({
  key: 'events',
  default: {},
});

const typographySettings = atom<ITypography>({
  key: 'typography',
  default: {
    ...typography,
  },
});

export const Store = {
  colorsSettings,
  droppedId,
  eventsToSpaces,
  events,
  typographySettings,
};