// 颜色的语义值，包含了旧版的映射处理
// stylelint-disable color-no-hex
@import '../override';
@import '../raw-vars';
@import '../color-generator';

$success-100: generateLighterColor($green-base, 5);
$success-400: generateLighterColor($green-base, 1);
$success-500: $green-base;
$success-600: generateDarkerColor($green-base, 1);

$warning-100: generateLighterColor($orange-base, 4);
$warning-400: generateLighterColor($orange-base, 1);
$warning-500: $orange-base;
$warning-600: generateDarkerColor($orange-base, 1);

$danger-100: generateLighterColor($red-base, 4);
$danger-400: generateLighterColor($red-base, 1);
$danger-500: $red-base;
$danger-600: generateDarkerColor($red-base, 1);

$primary-100: generateLighterColor($blue-base, 4);
$primary-400: generateLighterColor($blue-base, 1);
$primary-500: $blue-base;
$primary-600: generateDarkerColor($blue-base, 1);

$text-100: $gray-100;
$text-200: $gray-200;
$text-300: $gray-300;
$text-400: $gray-400;
$text-500: $gray-500;
$text-600: $gray-600;
$text-700: $gray-700;

$title-colors: (
  'color': $text-600,
);

$hint-colors: (
  'color': $text-500,
);

$disabled-colors: (
  'color': $text-400,
);

// use in section, card...
$section-colors: (
  'bg': $gray-100,
);

$body-colors: (
  'color': $text-600,
  'bg': $gray-200,
);

$success-colors: (
  'color': $success-500,
  'bg': $success-100,
  'border-color': $success-500,
);

$warning-colors: (
  'color': $warning-500,
  'bg': $warning-100,
  'border-color': $warning-500,
);

$danger-colors: (
  'color': $danger-500,
  'bg': $danger-100,
  'border-color': $danger-500,
);

$default-colors: (
  'color': $text-600,
  'bg': $text-100,
  'border-color': $gray-300,
  'hover-bg': $gray-200,
  'selected-bg': $primary-100,
  'disabled-color': $text-400,
  'disabled-bg': $gray-200,
);

$primary-colors: (
  'color': $text-100,
  // Primary background color of components, e.g. primary type button
  'bg': $primary-500,
  // Primary border color of components, e.g. primary type button
  'border-color': $primary-500,
  // Hover state of primary background color of components, e.g. primary type button
  'hover-bg': $primary-400,
  // Hover state of primary border color of components, e.g. primary type button
  'hover-border-color': $primary-400,
  // Active state of primary background color of components, e.g. primary type button
  'active-bg': $primary-600,
  // Active state of primary border color of components, e.g. primary type button
  'active-border-color': $primary-600,
);

$link-colors: (
  // Primary text link brand color
  'color': $primary-500,
  // Hover state of primary text link brand color
  'hover-color': $primary-400,
  // Active state of primary text link brand color
  'active-color': $primary-600
);

// components
$weak-link-colors: (
  'color': $text-600,
  // Hover state of primary text weak link brand color
  'hover-color': $primary-400,
  // Active state of primary text weak link brand color
  'active-color': $primary-600,
);

$rate-colors: (
  'bg': $star-color,
);

// 这是个特殊颜色，不在色板中
$badge-colors: (
  'bg': $badge-bg-color,
);

// 文字按钮
$text-button-colors: (
  'color': $primary-500,
  'bg': rgba($primary-500, 0.03),
  'hover-color': $primary-500,
  'hover-bg': rgba($primary-500, 0.06),
  'active-color': $primary-500,
  'active-bg': rgba($primary-500, 0.09),
);

// 图片按钮
$icon-button-colors: (
  'color': $text-600,
  'bg': $text-100,
  'hover-color': $text-600,
  'hover-bg': rgba($gray-700, 0.05),
  'active-color': $text-600,
  'active-bg': rgba($gray-700, 0.1),
);

$shadow-colors: (
  'bg': $gray-700,
);

// 所有种类颜色的集合
$color-sets: (
  'title': $title-colors,
  'hint': $hint-colors,
  'disabled': $disabled-colors,
  'body': $body-colors,
  'section': $section-colors,
  'shadow': $shadow-colors,
  'success': $success-colors,
  'warning': $warning-colors,
  'danger': $danger-colors,
  'link': $link-colors,
  'default': $default-colors,
  'primary': $primary-colors,
  'weak-link': $weak-link-colors,
  'rate': $rate-colors,
  'badge': $badge-colors,
  'text-button': $text-button-colors,
  'icon-button': $icon-button-colors,
);

// old
// Text colors
$theme-stroke-1: map-get($title-colors, 'color') !default; // text
$theme-stroke-2: map-get($hint-colors, 'color') !default; // text
$theme-stroke-3: map-get($hint-colors, 'color') !default; // help text
$theme-stroke-4: map-get($disabled-colors, 'color') !default; // disabled text

// Border and line colors
$theme-stroke-5: map-get($default-colors, 'border-color') !default;
$theme-stroke-6: map-get($default-colors, 'border-color') !default;

// Background colors
$theme-stroke-7: map-get($body-colors, 'bg') !default;
$theme-stroke-8: map-get($body-colors, 'bg') !default;

// White button normal background color
$theme-stroke-9: map-get($section-colors, 'bg') !default;

// Button background color
$theme-stroke-10: map-get($default-colors, 'border-color') !default; // Active
$theme-stroke-11: map-get($section-colors, 'bg') !default; // Hover

// Blue(primary)
$theme-primary-1: map-get($primary-colors, 'active-bg') !default;
$theme-primary-2: map-get($primary-colors, 'active-bg') !default;
$theme-primary-3: map-get($primary-colors, 'active-bg') !default;
$theme-primary-4: map-get($primary-colors, 'bg') !default;
$theme-primary-5: map-get($primary-colors, 'hover-bg') !default;
$theme-primary-6: map-get($primary-colors, 'hover-bg') !default;
$theme-primary-7: map-get($primary-colors, 'hover-bg') !default;
$theme-primary-8: map-get($default-colors, 'selected-bg') !default;

// Green
$theme-success-1: map-get($success-colors, 'color') !default;
$theme-success-2: map-get($success-colors, 'color') !default;
$theme-success-3: map-get($success-colors, 'color') !default;
$theme-success-4: map-get($success-colors, 'color') !default;
$theme-success-5: map-get($success-colors, 'bg') !default;

// Red
$theme-error-1: map-get($danger-colors, 'color') !default;
$theme-error-2: map-get($danger-colors, 'color') !default;
$theme-error-3: map-get($danger-colors, 'color') !default;
$theme-error-4: map-get($danger-colors, 'color') !default;
$theme-error-5: map-get($danger-colors, 'bg') !default;

// Orange
$theme-warn-1: map-get($warning-colors, 'color') !default;
$theme-warn-2: map-get($warning-colors, 'color') !default;
$theme-warn-3: map-get($warning-colors, 'color') !default;
$theme-warn-4: map-get($warning-colors, 'color') !default;
$theme-warn-5: map-get($warning-colors, 'bg') !default;

$loading-icon-youzan-color: #e00 !default;

// Constant black color for internal use
$color-black: #000;

// !!! DO NOT USE !!!
// These variables will be removed
$notify-error: rgba(255, 68, 68, 0.8);
$notify-success: rgba(68, 187, 136, 0.8);
$rate-star-color: map-get($rate-colors, 'bg');

$theme-colors: (
  'stroke': (
    $theme-stroke-1,
    $theme-stroke-2,
    $theme-stroke-3,
    $theme-stroke-4,
    $theme-stroke-5,
    $theme-stroke-6,
    $theme-stroke-7,
    $theme-stroke-8,
    $theme-stroke-9,
    $theme-stroke-10,
    $theme-stroke-11,
  ),
  'primary': (
    $theme-primary-1,
    $theme-primary-2,
    $theme-primary-3,
    $theme-primary-4,
    $theme-primary-5,
    $theme-primary-6,
    $theme-primary-7,
    $theme-primary-8,
  ),
  'success': (
    $theme-success-1,
    $theme-success-2,
    $theme-success-3,
    $theme-success-4,
    $theme-success-5,
  ),
  'error': (
    $theme-error-1,
    $theme-error-2,
    $theme-error-3,
    $theme-error-4,
    $theme-error-5,
  ),
  'warn': (
    $theme-warn-1,
    $theme-warn-2,
    $theme-warn-3,
    $theme-warn-4,
    $theme-warn-5,
  ),
);

// 旧版语义和新版语义的映射关系
$theme-colors-mapping: (
  'stroke': (
    (
      cat: 'title',
      attr: 'color',
    ),
    (
      cat: 'hint',
      attr: 'color',
    ),
    (
      cat: 'hint',
      attr: 'color',
    ),
    (
      cat: 'disabled',
      attr: 'color',
    ),
    (
      cat: 'default',
      attr: 'border-color',
    ),
    (
      cat: 'default',
      attr: 'border-color',
    ),
    (
      cat: 'body',
      attr: 'bg',
    ),
    (
      cat: 'body',
      attr: 'bg',
    ),
    (
      cat: 'section',
      attr: 'bg',
    ),
    (
      cat: 'default',
      attr: 'border-color',
    ),
    (
      cat: 'section',
      attr: 'bg',
    ),
  ),
  'primary': (
    (
      cat: 'primary',
      attr: 'active-bg',
    ),
    (
      cat: 'primary',
      attr: 'active-bg',
    ),
    (
      cat: 'primary',
      attr: 'active-bg',
    ),
    (
      cat: 'primary',
      attr: 'bg',
    ),
    (
      cat: 'primary',
      attr: 'hover-bg',
    ),
    (
      cat: 'primary',
      attr: 'hover-bg',
    ),
    (
      cat: 'primary',
      attr: 'hover-bg',
    ),
    (
      cat: 'default',
      attr: 'selected-bg',
    ),
  ),
  'success': (
    (
      cat: 'success',
      attr: 'color',
    ),
    (
      cat: 'success',
      attr: 'color',
    ),
    (
      cat: 'success',
      attr: 'color',
    ),
    (
      cat: 'success',
      attr: 'color',
    ),
    (
      cat: 'success',
      attr: 'bg',
    ),
  ),
  'error': (
    (
      cat: 'danger',
      attr: 'color',
    ),
    (
      cat: 'danger',
      attr: 'color',
    ),
    (
      cat: 'danger',
      attr: 'color',
    ),
    (
      cat: 'danger',
      attr: 'color',
    ),
    (
      cat: 'danger',
      attr: 'bg',
    ),
  ),
  'warn': (
    (
      cat: 'warning',
      attr: 'color',
    ),
    (
      cat: 'warning',
      attr: 'color',
    ),
    (
      cat: 'warning',
      attr: 'color',
    ),
    (
      cat: 'warning',
      attr: 'color',
    ),
    (
      cat: 'warning',
      attr: 'bg',
    ),
  ),
);