import { createContext, useMemo, useState } from 'react';

export const useEditStylesContext = () => {
  const [styles, setStyles] = useState<string>('');
  const [negativeStyles, setNegativeStyles] = useState<string>('');

  return useMemo(
    () => ({
      styles,
      negativeStyles,
      setStyles,
      setNegativeStyles,
    }),
    [styles, negativeStyles]
  );
};

const EditStylesContext = createContext<
  ReturnType<typeof useEditStylesContext>
>(undefined as never);

export default EditStylesContext;