From 25e94d057b02a0d2fe4c59304f4f8a05632c846d Mon Sep 17 00:00:00 2001
From: MeenamAfzal <meenamafzal1@gmail.com>
Date: Wed, 5 Jun 2024 03:37:51 +0500
Subject: [PATCH 1/2] styles updated

---
 .../lowcoder/src/comps/comps/dateComp/dateComp.tsx        | 2 +-
 .../lowcoder/src/comps/comps/dateComp/dateUIView.tsx      | 1 +
 .../src/comps/comps/selectInputComp/selectComp.tsx        | 6 +++---
 .../comps/comps/selectInputComp/selectCompConstants.tsx   | 8 +++++---
 .../lowcoder/src/comps/controls/styleControlConstants.tsx | 4 ++++
 5 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx b/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx
index b3496eb12..9e568fc5f 100644
--- a/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx
+++ b/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx
@@ -76,7 +76,7 @@ const commonChildren = {
   hourStep: RangeControl.closed(1, 24, 1),
   minuteStep: RangeControl.closed(1, 60, 1),
   secondStep: RangeControl.closed(1, 60, 1),
-  style: styleControl(InputFieldStyle),
+  style: withDefault(styleControl(InputFieldStyle),{background:'transparent'}),
   animationStyle: styleControl(AnimationStyle),
   labelStyle: styleControl(LabelStyle.filter((style) => ['accent', 'validate'].includes(style.name) === false)),
   suffixIcon: withDefault(IconControl, "/icon:regular/calendar"),
diff --git a/client/packages/lowcoder/src/comps/comps/dateComp/dateUIView.tsx b/client/packages/lowcoder/src/comps/comps/dateComp/dateUIView.tsx
index c00c05d61..7556037fa 100644
--- a/client/packages/lowcoder/src/comps/comps/dateComp/dateUIView.tsx
+++ b/client/packages/lowcoder/src/comps/comps/dateComp/dateUIView.tsx
@@ -11,6 +11,7 @@ import { default as DatePicker } from "antd/es/date-picker";
 
 const DatePickerStyled = styled(DatePicker)<{ $style: DateTimeStyleType }>`
   width: 100%;
+  box-shadow: ${props=>`${props.$style.boxShadow} ${props.$style.boxShadowColor}`};
   ${(props) => props.$style && getStyle(props.$style)}
 `;
 
diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectComp.tsx
index 5224c1c98..5fd71ece6 100644
--- a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectComp.tsx
+++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectComp.tsx
@@ -18,16 +18,16 @@ import {
 import { useRef } from "react";
 import { RecordConstructorToView } from "lowcoder-core";
 import { fixOldInputCompData } from "../textInputComp/textInputConstants";
-import { migrateOldData } from "comps/generators/simpleGenerators";
+import { migrateOldData, withDefault } from "comps/generators/simpleGenerators";
 
 let SelectBasicComp = (function () {
   const childrenMap = {
     ...SelectChildrenMap,
     defaultValue: stringExposingStateControl("defaultValue"),
     value: stringExposingStateControl("value"),
-    style: styleControl(InputFieldStyle),
+    style: withDefault(styleControl(InputFieldStyle),{background:'transparent'}),
     labelStyle: styleControl(LabelStyle),
-    inputFieldStyle: styleControl(SelectStyle),
+    inputFieldStyle: withDefault(styleControl(SelectStyle),{borderWidth:'1px'}),
     childrenInputFieldStyle: styleControl(ChildrenMultiSelectStyle)
   };
   return new UICompBuilder(childrenMap, (props, dispatch) => {
diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx
index fd8f22a7b..554ef2ce5 100644
--- a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx
+++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx
@@ -109,6 +109,7 @@ export const getStyle = (
         background-color: ${style.background};
         border-color: ${style.border};
         border-width:${(style as SelectStyleType).borderWidth};
+        box-shadow:${(style as SelectStyleType).boxShadow} ${(style as SelectStyleType).boxShadowColor};
       }
 
       &.ant-select-focused,
@@ -181,10 +182,9 @@ const getDropdownStyle = (style: MultiSelectStyleType) => {
   `;
 };
 
-const Select = styled(AntdSelect) <{ $style: SelectStyleType & MultiSelectStyleType }>`
+const Select = styled(AntdSelect) <{ $style: SelectStyleType & MultiSelectStyleType,$inputFieldStyle:SelectStyleType }>`
   width: 100%;
-
-  ${(props) => props.$style && getStyle(props.$style)}
+  ${(props) => props.$inputFieldStyle && getStyle(props.$inputFieldStyle)}
 `;
 
 const DropdownStyled = styled.div<{ $style: ChildrenMultiSelectStyleType }>`
@@ -246,6 +246,7 @@ export const SelectUIView = (
     value: any;
     style: SelectStyleType | MultiSelectStyleType;
     childrenInputFieldStyle: ChildrenMultiSelectStyleType;
+    inputFieldStyle: SelectStyleType;
     onChange: (value: any) => void;
     dispatch: DispatchType;
   }
@@ -253,6 +254,7 @@ export const SelectUIView = (
   return <Select
     ref={props.viewRef}
     mode={props.mode}
+    $inputFieldStyle={props.inputFieldStyle}
     $style={props.style as SelectStyleType & MultiSelectStyleType}
     disabled={props.disabled}
     allowClear={props.allowClear}
diff --git a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
index 85b4f3b71..fd2cfa518 100644
--- a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
+++ b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
@@ -1192,6 +1192,8 @@ export const SelectStyle = [
   ...replaceAndMergeMultipleStyles(STYLING_FIELDS_SEQUENCE.filter(style=>style.name!=='rotation'), "border", [
     ...getStaticBgBorderRadiusByBg(SURFACE_COLOR, "pc"),
   ]),
+  BOXSHADOW,
+  BOXSHADOWCOLOR,
   ...ACCENT_VALIDATE,
 ] as const;
 
@@ -1584,6 +1586,8 @@ export const DateTimeStyle = [
   PADDING,
   BORDER_STYLE,
   BORDER_WIDTH,
+  BOXSHADOW,
+  BOXSHADOWCOLOR,
   ...ACCENT_VALIDATE,
 ] as const;
 

From 76b775dee2950a2305a07f91fdc403a96753ad8e Mon Sep 17 00:00:00 2001
From: MeenamAfzal <meenamafzal1@gmail.com>
Date: Wed, 5 Jun 2024 03:44:01 +0500
Subject: [PATCH 2/2] box shadow updated

---
 .../lowcoder/src/comps/comps/dateComp/dateRangeUIView.tsx   | 4 +++-
 .../src/comps/comps/selectInputComp/multiSelectComp.tsx     | 6 +++---
 .../lowcoder/src/comps/controls/styleControlConstants.tsx   | 2 ++
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/client/packages/lowcoder/src/comps/comps/dateComp/dateRangeUIView.tsx b/client/packages/lowcoder/src/comps/comps/dateComp/dateRangeUIView.tsx
index ff1478fe4..58af9f5eb 100644
--- a/client/packages/lowcoder/src/comps/comps/dateComp/dateRangeUIView.tsx
+++ b/client/packages/lowcoder/src/comps/comps/dateComp/dateRangeUIView.tsx
@@ -13,8 +13,10 @@ import { omit } from "lodash";
 
 const { RangePicker } = DatePicker;
 
-const RangePickerStyled = styled(RangePicker)<{ $style: DateTimeStyleType }>`
+const RangePickerStyled = styled(RangePicker)<{$style: DateTimeStyleType}>`
   width: 100%;
+  box-shadow: ${(props) =>
+    `${props.$style.boxShadow} ${props.$style.boxShadowColor}`};
   ${(props) => props.$style && getStyle(props.$style)}
 `;
 
diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/multiSelectComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/multiSelectComp.tsx
index b08a8276a..cba0023b9 100644
--- a/client/packages/lowcoder/src/comps/comps/selectInputComp/multiSelectComp.tsx
+++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/multiSelectComp.tsx
@@ -14,7 +14,7 @@ import { SelectInputInvalidConfig, useSelectInputValidate } from "./selectInputC
 
 import { PaddingControl } from "../../controls/paddingControl";	
 import { MarginControl } from "../../controls/marginControl";
-import { migrateOldData } from "comps/generators/simpleGenerators";
+import { migrateOldData, withDefault } from "comps/generators/simpleGenerators";
 import { fixOldInputCompData } from "../textInputComp/textInputConstants";
 
 let MultiSelectBasicComp = (function () {
@@ -22,9 +22,9 @@ let MultiSelectBasicComp = (function () {
     ...SelectChildrenMap,
     defaultValue: arrayStringExposingStateControl("defaultValue", ["1", "2"]),
     value: arrayStringExposingStateControl("value"),
-    style: styleControl(InputFieldStyle),
+    style: withDefault(styleControl(InputFieldStyle),{background:'transparent'}),
     labelStyle:styleControl(LabelStyle),
-    inputFieldStyle:styleControl(MultiSelectStyle),
+    inputFieldStyle:withDefault(styleControl(MultiSelectStyle),{borderWidth:'1px'}),
     childrenInputFieldStyle:styleControl(ChildrenMultiSelectStyle),
     margin: MarginControl,	
     padding: PaddingControl,
diff --git a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
index fd2cfa518..66bff3bd2 100644
--- a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
+++ b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx
@@ -1227,6 +1227,8 @@ export const MultiSelectStyle = [
     transformer: toSelf,
     platform: "pc",
   },
+  BOXSHADOW,
+  BOXSHADOWCOLOR,
   ...ACCENT_VALIDATE,
 ] as const;