import { ListHoverImageSettings } from '../types';

const DEFAULT_FALLBACK_IMAGE = '/noimage.jpg';

export const defaultSettings: Required<ListHoverImageSettings> = {
  maxImages: 3,
  fallbackImage: DEFAULT_FALLBACK_IMAGE,
  customStyles: {},
  customRenderers: {},
  theme: {
    indicatorSize: 'w-2.5 h-2.5 lg:w-3.5 lg:h-3.5',
    indicatorActiveColor: 'bg-secondary',
    indicatorBorderColor: 'border-white',
    indicatorBorderRadius: 'rounded-full'
  }
};

export function mergeSettings(
  userSettings?: Partial<ListHoverImageSettings>
): Required<ListHoverImageSettings> {
  if (!userSettings) {
    return defaultSettings;
  }

  return {
    ...defaultSettings,
    ...userSettings,
    customStyles: {
      ...defaultSettings.customStyles,
      ...userSettings.customStyles
    },
    customRenderers: {
      ...defaultSettings.customRenderers,
      ...userSettings.customRenderers
    },
    theme: {
      ...defaultSettings.theme,
      ...userSettings.theme
    }
  };
}