feat(Popover): support config action color (#8049)

src/popover/README.md

@@ -221,6 +221,7 @@ export default {
 | --------- | ----------------------- | --------------------------- |
 | text      | Action Text             | _string_                    |
 | icon      | Icon                    | _string_                    |
+| color     | Action Color            | _string_                    |
 | disabled  | Whether to be disabled  | _boolean_                   |
 | className | className of the option | _string \| Array \| object_ |
 

src/popover/README.zh-CN.md

@@ -237,6 +237,7 @@ export default {
 | --- | --- | --- |
 | text | 选项文字 | _string_ |
 | icon | 文字左侧的图标，支持传入[图标名称](#/zh-CN/icon)或图片链接 | _string_ |
+| color | 选项文字颜色 | _string_ |
 | disabled | 是否为禁用状态 | _boolean_ |
 | className | 为对应选项添加额外的类名 | _string \| Array \| object_ |
 

src/popover/index.js

@@ -124,11 +124,12 @@ export default createComponent({
     };
 
     const renderAction = (action, index) => {
-      const { icon, text, disabled, className } = action;
+      const { icon, text, color, disabled, className } = action;
       return (
         <div
           role="menuitem"
           class={[bem('action', { disabled, 'with-icon': icon }), className]}
+          style={{ color }}
           onClick={() => onClickAction(action, index)}
         >
           {icon && <Icon name={icon} class={bem('action-icon')} />}

src/popover/test/__snapshots__/index.spec.js.snap

@@ -17,7 +17,7 @@ exports[`should locate to reference element when showed 1`] = `
 
 exports[`should locate to reference element when showed 2`] = `
 <transition-stub>
-  <div style="z-index: 2006; position: absolute; left: 0px; top: 8px; margin: 0px;"
+  <div style="z-index: 2007; position: absolute; left: 0px; top: 8px; margin: 0px;"
        class="van-popup van-popover van-popover--light"
        data-popper-placement="bottom"
   >
@@ -33,7 +33,7 @@ exports[`should locate to reference element when showed 2`] = `
 
 exports[`should locate to reference element when showed 3`] = `
 <transition-stub>
-  <div style="z-index: 2006; display: none;"
+  <div style="z-index: 2007; display: none;"
        class="van-popup van-popover van-popover--light"
   >
     <div class="van-popover__arrow">
@@ -48,7 +48,7 @@ exports[`should locate to reference element when showed 3`] = `
 
 exports[`should watch placement prop and update location 1`] = `
 <transition-stub>
-  <div style="z-index: 2007; position: absolute; left: 0px; top: -8px; margin: 0px;"
+  <div style="z-index: 2008; position: absolute; left: 0px; top: -8px; margin: 0px;"
        class="van-popup van-popover van-popover--light"
        data-popper-placement="top"
   >

src/popover/test/index.spec.js

@@ -82,6 +82,20 @@ test('should allow to custom the className of action', () => {
   expect(wrapper.find('.van-popover__action').html()).toMatchSnapshot();
 });
 
+test('should allow to custom the color of action test', () => {
+  const wrapper = mount(Popover, {
+    props: {
+      show: true,
+      teleport: null,
+      actions: [{ text: 'Option', color: 'red' }],
+    },
+  });
+
+  expect(wrapper.find('.van-popover__action').element.style.color).toEqual(
+    'red'
+  );
+});
+
 test('should locate to reference element when showed', async () => {
   const root = document.createElement('div');
   const wrapper = mount(Popover, {