From 9d8d18033e418528abc97bec9e39a81f8d11315c Mon Sep 17 00:00:00 2001
From: star-hamster <52915367+star-hamster@users.noreply.github.com>
Date: Fri, 5 May 2023 21:50:25 +0800
Subject: [PATCH] fix(OverlayTrigger): fix children style props issue. fix #962
 (#963)

* fix(overlaytrigger): Fix the issue of invalid styles #962

* update(form): add example

---------

Co-authored-by: shenzhiqing <shenzhiqing@nihaosi.com>
---
 packages/react-form/README.md                | 40 +++++++++++++++++++-
 packages/react-overlay-trigger/src/index.tsx |  3 +-
 2 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/packages/react-form/README.md b/packages/react-form/README.md
index bd870b5bfe..8e3a76d078 100644
--- a/packages/react-form/README.md
+++ b/packages/react-form/README.md
@@ -98,7 +98,7 @@ export default function Demo() {
 
 ```jsx mdx:preview&bg=#fff
 import React from 'react';
-import { Form, Input, Notify, Checkbox, Switch, RadioGroup, Radio, Textarea, Row, Col, Button } from 'uiw';
+import { Form, Input, Notify, Checkbox, Switch, RadioGroup, Radio, Textarea, Row, Col, Button, Select, SearchSelect } from 'uiw';
 
 export default function Demo() {
   return(
@@ -142,6 +142,40 @@ export default function Demo() {
           label: '年龄',
           children: <Input type="number" />
         },
+        select: {
+          children: (
+            <Select>
+              <Select.Option value="w">Choose an item...</Select.Option>
+              <Select.Option value="1">One</Select.Option>
+              <Select.Option value="2">Two</Select.Option>
+              <Select.Option value="3">Three</Select.Option>
+              <Select.Option value="4">Four</Select.Option>
+            </Select>
+          )
+        },
+        searchSelect: {
+          initialValue:[{label: 'a7', value: 7},{label: 'a8', value: 8}],
+          children: (
+            <SearchSelect
+              allowClear
+              labelInValue={true}
+              showSearch={true}
+              mode="multiple"
+              disabled={false}
+              placeholder="请选择选项"
+              option={[
+                { label: 'a1', value: 1 },
+                { label: 'a2', value: 2 },
+                { label: 'a3', value: 3 },
+                { label: 'a4', value: 4 },
+                { label: 'a5', value: 5 },
+                { label: 'a6', value: 6 },
+                { label: 'a7', value: 7 },
+                { label: 'a8', value: 8 },
+              ]}
+            />
+          )
+        },
         checkbox: {
           initialValue: ['四川菜'],
           label: '选择你想吃的菜',
@@ -206,6 +240,10 @@ export default function Demo() {
               <Col>{fields.userName}</Col>
               <Col>{fields.age}</Col>
             </Row>
+            <Row gutter={10}>
+              <Col>{fields.select}</Col>
+              <Col>{fields.searchSelect}</Col>
+            </Row>
             <Row gutter={10}>
               <Col>{fields.checkbox}</Col>
               <Col>{fields.checkboxOne}</Col>
diff --git a/packages/react-overlay-trigger/src/index.tsx b/packages/react-overlay-trigger/src/index.tsx
index 7d52f7a4cd..94cd5664a9 100644
--- a/packages/react-overlay-trigger/src/index.tsx
+++ b/packages/react-overlay-trigger/src/index.tsx
@@ -307,6 +307,7 @@ export default React.forwardRef<OverlayTriggerRef, OverlayTriggerProps>((props,
     }
   }
   overlayProps.style = { ...overlayProps.style, ...overlayStyl };
+
   return (
     <React.Fragment>
       {cloneElement(
@@ -314,7 +315,7 @@ export default React.forwardRef<OverlayTriggerRef, OverlayTriggerProps>((props,
         Object.assign({}, child.props, {
           ...triggerProps,
           ref: triggerRef,
-          style: { zIndex: zIndex.current },
+          style: { ...child.props?.style, zIndex: zIndex.current },
           className: [child.props.className, disabled ? `${prefixCls}-disabled` : null]
             .filter(Boolean)
             .join(' ')