From ff893806a338188175c48f4032b8bef2990cd8be Mon Sep 17 00:00:00 2001
From: 2betop <2betop.cn@gmail.com>
Date: Thu, 2 Jan 2020 17:52:17 +0800
Subject: [PATCH] =?UTF-8?q?combo=20=E4=BA=A4=E5=8F=89=E6=8B=96=E6=8B=BD?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 scss/components/form/_combo.scss  |  4 ++++
 src/components/TooltipWrapper.tsx |  5 ++++-
 src/renderers/Form/Combo.tsx      |  3 ++-
 src/renderers/Remark.tsx          | 30 +++++++++++++++---------------
 4 files changed, 25 insertions(+), 17 deletions(-)

diff --git a/scss/components/form/_combo.scss b/scss/components/form/_combo.scss
index 6b82bc5b..d3ad66ee 100644
--- a/scss/components/form/_combo.scss
+++ b/scss/components/form/_combo.scss
@@ -53,6 +53,10 @@
     margin-bottom: $Combo-items-marginBottom;
   }
 
+  &-item {
+    background: $white;
+  }
+
   &--hor {
     .#{$ns}Combo-item {
       display: flex;
diff --git a/src/components/TooltipWrapper.tsx b/src/components/TooltipWrapper.tsx
index 9c21f601..1a7e1e1a 100644
--- a/src/components/TooltipWrapper.tsx
+++ b/src/components/TooltipWrapper.tsx
@@ -32,6 +32,7 @@ export interface TooltipWrapperProps {
   overlay?: any;
   delay: number;
   theme?: string;
+  tooltipClassName?: string;
 }
 
 interface TooltipWrapperState {
@@ -171,7 +172,8 @@ export class TooltipWrapper extends React.Component<
       placement,
       container,
       trigger,
-      rootClose
+      rootClose,
+      tooltipClassName
     } = this.props;
 
     const child = React.Children.only(children);
@@ -214,6 +216,7 @@ export class TooltipWrapper extends React.Component<
       >
         <Tooltip
           title={typeof tooltip !== "string" ? tooltip.title : undefined}
+          className={tooltipClassName}
         >
           {tooltip && (tooltip as TooltipObject).render ? (
             (tooltip as TooltipObject).render!()
diff --git a/src/renderers/Form/Combo.tsx b/src/renderers/Form/Combo.tsx
index 6e47b875..5da66f8b 100644
--- a/src/renderers/Form/Combo.tsx
+++ b/src/renderers/Form/Combo.tsx
@@ -124,6 +124,7 @@ export default class ComboControl extends React.Component<ComboProps> {
   sortable?: Sortable;
   defaultValue?: any;
   toDispose: Array<Function> = [];
+  id: string = guid();
   constructor(props: ComboProps) {
     super(props);
 
@@ -475,7 +476,7 @@ export default class ComboControl extends React.Component<ComboProps> {
     this.sortable = new Sortable(
       dom.querySelector(`.${ns}Combo-items`) as HTMLElement,
       {
-        group: 'combo',
+        group: `combo-${this.id}`,
         animation: 150,
         handle: `.${ns}Combo-itemDrager`,
         ghostClass: `${ns}Combo-item--dragging`,
diff --git a/src/renderers/Remark.tsx b/src/renderers/Remark.tsx
index 41a2cd18..8bc1ce15 100644
--- a/src/renderers/Remark.tsx
+++ b/src/renderers/Remark.tsx
@@ -1,19 +1,19 @@
-import React from 'react';
-import {Renderer, RendererProps} from '../factory';
-import {Api, SchemaNode, Schema, Action} from '../types';
-import cx from 'classnames';
-import TooltipWrapper from '../components/TooltipWrapper';
-import {filter} from '../utils/tpl';
-import {themeable} from '../theme';
+import React from "react";
+import { Renderer, RendererProps } from "../factory";
+import { Api, SchemaNode, Schema, Action } from "../types";
+import cx from "classnames";
+import TooltipWrapper from "../components/TooltipWrapper";
+import { filter } from "../utils/tpl";
+import { themeable } from "../theme";
 
 export function filterContents(
   tooltip:
     | string
     | undefined
-    | {title?: string; content?: string; body?: string},
+    | { title?: string; content?: string; body?: string },
   data: any
 ) {
-  if (typeof tooltip === 'string') {
+  if (typeof tooltip === "string") {
     return filter(tooltip, data);
   } else if (tooltip) {
     return tooltip.title
@@ -21,11 +21,11 @@ export function filterContents(
           title: filter(tooltip.title, data),
           content:
             tooltip.content || tooltip.body
-              ? filter(tooltip.content || tooltip.body || '', data)
+              ? filter(tooltip.content || tooltip.body || "", data)
               : undefined
         }
       : tooltip.content || tooltip.body
-      ? filter(tooltip.content || tooltip.body || '', data)
+      ? filter(tooltip.content || tooltip.body || "", data)
       : undefined;
   }
   return tooltip;
@@ -43,8 +43,8 @@ type RemarkProps = {
 class Remark extends React.Component<RemarkProps> {
   static propsList: Array<string> = [];
   static defaultProps = {
-    icon: 'fa fa-question-circle',
-    trigger: ['hover', 'focus']
+    icon: "fa fa-question-circle",
+    trigger: ["hover", "focus"]
   };
 
   render() {
@@ -79,7 +79,7 @@ class Remark extends React.Component<RemarkProps> {
             (tooltip && tooltip.className) || className || `Remark--warning`
           )}
         >
-          <i className={cx('Remark-icon', (tooltip && tooltip.icon) || icon)} />
+          <i className={cx("Remark-icon", (tooltip && tooltip.icon) || icon)} />
         </div>
       </TooltipWrapper>
     );
@@ -90,6 +90,6 @@ export default themeable(Remark);
 
 @Renderer({
   test: /(^|\/)remark$/,
-  name: 'remark'
+  name: "remark"
 })
 export class RemarkRenderer extends Remark {}