---

import { getThemeStore } from '@src/theme';
import { SettingField, SettingsTab, SettingsValues } from '@src/types';

export interface RectangleSettings extends SettingsValues {
  borderColor: string;
  fillColor: string;
}

export function createDefaultSettings(): RectangleSettings {
  return {
    borderColor: getThemeStore().colors.rectangleBorderFill,
    fillColor: getThemeStore().colors.rectangleAreaFill,
  };
}

export function getRectangleSettingsTabs(settings: RectangleSettings): SettingsTab[] {
  const fields: SettingField[] = [
    {
      key: 'borderColor',
      label: 'Цвет границы',
      type: 'color',
      defaultValue: settings.borderColor,
    },
    {
      key: 'fillColor',
      label: 'Цвет фона',
      type: 'color',
      defaultValue: settings.fillColor,
    },
  ];

  return [{ key: 'style', label: 'Стиль', fields }];
}



public getSettingsValues(): RectangleSettings {
  return { ...this.settings };
}

public getSettingsTabs(): SettingsTab[] {
  return getRectangleSettingsTabs(this.settings);
}

public updateSettings(settings: SettingsValues): void {
  this.settings = {
    ...this.settings,
    ...(settings as Partial<RectangleSettings>),
  };

  this.render();
}



public getSettingsValues(): RectangleSettings {
  return { ...this.settings };
}

public getSettingsTabs(): SettingsTab[] {
  return getRectangleSettingsTabs(this.settings);
}

public updateSettings(settings: SettingsValues): void {
  this.settings = {
    ...this.settings,
    ...(settings as Partial<RectangleSettings>),
  };

  this.render();
}