From ad4f76bdbd81c39fe4ca533182e7c725e6674580 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Tue, 3 Sep 2019 09:57:58 +0800
Subject: [PATCH] fix(DropdownItem): missing default active color (#4330)

---
 src/dropdown-item/index.js                    |  2 +-
 src/dropdown-item/index.less                  |  8 ++++++++
 .../test/__snapshots__/index.spec.js.snap     | 20 +++++++++----------
 src/style/var.less                            |  1 +
 4 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/dropdown-item/index.js b/src/dropdown-item/index.js
index e124ca6f8..bfa1ec551 100644
--- a/src/dropdown-item/index.js
+++ b/src/dropdown-item/index.js
@@ -82,7 +82,7 @@ export default createComponent({
           key={option.value}
           icon={option.icon}
           title={option.text}
-          class={bem('option')}
+          class={bem('option', { active })}
           style={{ color: active ? activeColor : '' }}
           onClick={() => {
             this.showPopup = false;
diff --git a/src/dropdown-item/index.less b/src/dropdown-item/index.less
index 7956223a4..162dbe41b 100644
--- a/src/dropdown-item/index.less
+++ b/src/dropdown-item/index.less
@@ -8,6 +8,14 @@
 
   &__option {
     text-align: left;
+
+    &--active {
+      color: @dropdown-menu-option-active-color;
+
+      .van-dropdown-item__icon {
+        color: @dropdown-menu-option-active-color;
+      }
+    }
   }
 
   &--up {
diff --git a/src/dropdown-menu/test/__snapshots__/index.spec.js.snap b/src/dropdown-menu/test/__snapshots__/index.spec.js.snap
index 9f085570f..3ff561ea4 100644
--- a/src/dropdown-menu/test/__snapshots__/index.spec.js.snap
+++ b/src/dropdown-menu/test/__snapshots__/index.spec.js.snap
@@ -10,7 +10,7 @@ exports[`click option 1`] = `
       <div class="van-cell van-cell--clickable van-dropdown-item__option">
         <div class="van-cell__title"><span>A</span></div>
       </div>
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>B</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -29,7 +29,7 @@ exports[`close-on-click-outside 1`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s; display: none;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -87,7 +87,7 @@ exports[`direction up 2`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title van-dropdown-menu__title--down"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--up" style="z-index: 10; bottom: 1000px;">
     <div class="van-popup van-popup--bottom van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-bottom">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -109,7 +109,7 @@ exports[`disable close-on-click-outside 1`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -140,7 +140,7 @@ exports[`render option icon 1`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option"><i class="van-icon van-icon-success van-cell__left-icon">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active"><i class="van-icon van-icon-success van-cell__left-icon">
           <!----></i>
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
@@ -164,7 +164,7 @@ exports[`show dropdown item 1`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -186,7 +186,7 @@ exports[`show dropdown item 2`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title van-dropdown-menu__title--active van-dropdown-menu__title--down"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0s; display: none;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -198,7 +198,7 @@ exports[`show dropdown item 2`] = `
   </div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -217,7 +217,7 @@ exports[`show dropdown item 3`] = `
   <div role="button" tabindex="0" class="van-dropdown-menu__item"><span class="van-dropdown-menu__title"><div class="van-ellipsis">A</div></span></div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0s; display: none;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
@@ -229,7 +229,7 @@ exports[`show dropdown item 3`] = `
   </div>
   <div class="van-dropdown-item van-dropdown-item--down" style="z-index: 10; top: 0px;">
     <div class="van-popup van-popup--top van-dropdown-item__content" style="transition-duration: 0.2s; display: none;" name="van-popup-slide-top">
-      <div class="van-cell van-cell--clickable van-dropdown-item__option">
+      <div class="van-cell van-cell--clickable van-dropdown-item__option van-dropdown-item__option--active">
         <div class="van-cell__title"><span>A</span></div>
         <div class="van-cell__value"><i class="van-icon van-icon-success van-dropdown-item__icon">
             <!----></i></div>
diff --git a/src/style/var.less b/src/style/var.less
index ea60bc9ea..ea28e9832 100644
--- a/src/style/var.less
+++ b/src/style/var.less
@@ -260,6 +260,7 @@
 @dropdown-menu-title-disabled-text-color: @gray-dark;
 @dropdown-menu-title-padding: 0 @padding-xs;
 @dropdown-menu-title-line-height: 18px;
+@dropdown-menu-option-active-color: @blue;
 
 // Field
 @field-label-width: 90px;