field style added to select

Author: MenaamAfzal

client/packages/lowcoder/src/comps/comps/selectInputComp/selectComp.tsx

@@ -1,5 +1,5 @@
 import { styleControl } from "comps/controls/styleControl";
-import { LabelStyle, SelectStyle } from "comps/controls/styleControlConstants";
+import { ComponentStyle, LabelStyle, SelectStyle } from "comps/controls/styleControlConstants";
 import { trans } from "i18n";
 import { stringExposingStateControl } from "../../controls/codeStateControl";
 import { UICompBuilder } from "../../generators";
@@ -26,7 +26,8 @@ let SelectBasicComp = (function () {
     defaultValue: stringExposingStateControl("defaultValue"),
     value: stringExposingStateControl("value"),
     style: styleControl(SelectStyle),
-    labelStyle: styleControl(LabelStyle)
+    labelStyle: styleControl(LabelStyle),
+    field: styleControl(ComponentStyle)
   };
   return new UICompBuilder(childrenMap, (props, dispatch) => {
     const [
@@ -42,7 +43,8 @@ let SelectBasicComp = (function () {
     return props.label({
       required: props.required,
       style: props.style,
-      labelStyle:props.labelStyle,
+      labelStyle: props.labelStyle,
+      field:props.field,
       children: (
         <SelectUIView
           {...props}

client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx

@@ -38,6 +38,7 @@ import {
   TreeSelectStyleType,
   widthCalculator,
   heightCalculator,
+  ComponentStyle,
 } from "comps/controls/styleControlConstants";
 import { stateComp, withDefault } from "../../generators";
 import {
@@ -56,6 +57,7 @@ import { blurMethod, focusMethod } from "comps/utils/methodUtils";
 
 import { useContext } from "react";
 import { EditorContext } from "comps/editorState";
+import { styleControl } from "@lowcoder-ee/index.sdk";
 
 export const getStyle = (
   style:
@@ -217,6 +219,7 @@ export const SelectChildrenMap = {
   viewRef: RefControl<BaseSelectRef>,
   margin: MarginControl,
   padding: PaddingControl,
+  field:styleControl(ComponentStyle),
   ...SelectInputValidationChildren,
   ...formDataChildren,
 };
@@ -291,6 +294,7 @@ export const SelectPropertyView = (
     value: { propertyView: (params: ControlParams) => ControlNode };
     style: { getPropertyView: () => ControlNode };
     labelStyle: { getPropertyView: () => ControlNode };
+    field: { getPropertyView: () => ControlNode };
   }
 ) => (
   <>
@@ -336,6 +340,9 @@ export const SelectPropertyView = (
           <Section name={sectionNames.labelStyle}>
             {children.labelStyle.getPropertyView()}
           </Section>
+          <Section name={sectionNames.field}>
+            {children.field.getPropertyView()}
+          </Section>
         </>
       )}
   </>