Merge pull request #873 from MenamAfzal/fix/style-issues

Fix/style issues

Author: FalkWolsky

client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx

@@ -50,6 +50,11 @@ import { DateRangeUIView } from "comps/comps/dateComp/dateRangeUIView";
 
 import { EditorContext } from "comps/editorState";
 
+const defaultStyle = {
+  borderStyle: 'solid',
+  borderWidth: '1px',
+}
+
 const EventOptions = [changeEvent, focusEvent, blurEvent] as const;
 
 const validationChildren = {
@@ -76,7 +81,7 @@ const commonChildren = {
   suffixIcon: withDefault(IconControl, "/icon:regular/calendar"),
   ...validationChildren,
   viewRef: RefControl<CommonPickerMethods>,
-  inputFieldStyle:styleControl(DateTimeStyle)
+  inputFieldStyle: withDefault(styleControl(DateTimeStyle), defaultStyle),
 };
 type CommonChildrenType = RecordConstructorToComp<typeof commonChildren>;
 

client/packages/lowcoder/src/comps/comps/numberInputComp/numberInputComp.tsx

@@ -257,11 +257,11 @@ const childrenMap = {
   allowNull: BoolControl,
   onEvent: InputEventHandlerControl,
   viewRef: RefControl<HTMLInputElement>,
-  style: styleControl(InputFieldStyle),
+  style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
   labelStyle:styleControl(LabelStyle),
   prefixText : stringExposingStateControl("defaultValue"),
   prefixIcon: IconControl,
-  inputFieldStyle:styleControl(InputLikeStyle),
+  inputFieldStyle: withDefault(styleControl(InputLikeStyle), {borderWidth: '1px'}) ,
   // validation
   required: BoolControl,
   min: UndefinedNumberControl,

client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx

@@ -71,7 +71,7 @@ export const SliderChildren = {
   label: LabelControl,
   disabled: BoolCodeControl,
   onEvent: ChangeEventHandlerControl,
-  style: styleControl(InputFieldStyle),
+  style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
   labelStyle:styleControl(LabelStyle.filter((style)=> ['accent','validate'].includes(style.name) === false)),
   prefixIcon: IconControl,
   suffixIcon: IconControl,

client/packages/lowcoder/src/comps/comps/ratingComp.tsx

@@ -43,7 +43,7 @@ const RatingBasicComp = (function () {
     allowHalf: BoolControl,
     disabled: BoolCodeControl,
     onEvent: eventHandlerControl(EventOptions),
-    style: styleControl(InputFieldStyle),
+    style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
     labelStyle: styleControl(LabelStyle.filter((style) => ['accent', 'validate'].includes(style.name) === false)),
     inputFieldStyle:migrateOldData(styleControl(RatingStyle), fixOldData),
     ...formDataChildren,

client/packages/lowcoder/src/comps/comps/remoteComp/loaders.tsx

@@ -13,11 +13,9 @@ async function npmLoader(
 
   // Falk: removed "packageVersion = "latest" as default value fir packageVersion - to ensure no automatic version jumping.
   const localPackageVersion = remoteInfo.packageVersion || "latest";
- 
   const { packageName, packageVersion, compName } = remoteInfo;
   const entry = `${NPM_PLUGIN_ASSETS_BASE_URL}/${packageName}@${localPackageVersion}/index.js`;
-  //  const entry = `../../../../../public/package/index.js`; 
-  // console.log("Entry", entry);
+
   try {
     const module = await import(
       /* @vite-ignore */

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

@@ -25,15 +25,13 @@ import { RefControl } from "comps/controls/refControl";
 
 import { useContext } from "react";
 import { EditorContext } from "comps/editorState";
-import { migrateOldData } from "comps/generators/simpleGenerators";
+import { migrateOldData, withDefault } from "comps/generators/simpleGenerators";
 import { fixOldInputCompData } from "../textInputComp/textInputConstants";
 
 
 const getStyle = (style: SegmentStyleType) => {
   return css`
     &.ant-segmented:not(.ant-segmented-disabled) {
-      background-color: ${style.background};
-
       &,
       .ant-segmented-item-selected,
       .ant-segmented-thumb,
@@ -79,7 +77,7 @@ const SegmentChildrenMap = {
   disabled: BoolCodeControl,
   onEvent: ChangeEventHandlerControl,
   options: SelectOptionControl,
-  style: styleControl(SegmentStyle),
+  style: withDefault(styleControl(SegmentStyle),{borderWidth:'1px'}),
   viewRef: RefControl<HTMLDivElement>,
 
   ...SelectInputValidationChildren,

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

@@ -7,7 +7,7 @@ import { StepOptionControl } from "comps/controls/optionsControl";
 import { styleControl } from "comps/controls/styleControl";
 import { StepsStyle, StepsStyleType, heightCalculator, widthCalculator, marginCalculator } from "comps/controls/styleControlConstants";
 import styled, { css } from "styled-components";
-import { UICompBuilder } from "../../generators";
+import { UICompBuilder, withDefault } from "../../generators";
 import { CommonNameConfig, NameConfig, withExposingConfigs } from "../../generators/withExposing";
 import { selectDivRefMethods, } from "./selectInputConstants";
 import { Section, sectionNames } from "lowcoder-design";
@@ -91,7 +91,7 @@ const StepsChildrenMap = {
   disabled: BoolCodeControl,
   onEvent: ChangeEventHandlerControl,
   options: StepOptionControl,
-  style: styleControl(StepsStyle),
+  style: withDefault( styleControl(StepsStyle), {text:'#D7D9E0'}),
   viewRef: RefControl<HTMLDivElement>
 };
 

client/packages/lowcoder/src/comps/comps/textInputComp/inputComp.tsx

@@ -31,7 +31,7 @@ import { IconControl } from "comps/controls/iconControl";
 import { hasIcon } from "comps/utils";
 import { InputRef } from "antd/es/input";
 import { RefControl } from "comps/controls/refControl";
-import { migrateOldData } from "comps/generators/simpleGenerators";
+import { migrateOldData, withDefault } from "comps/generators/simpleGenerators";
 
 import React, { useContext } from "react";
 import { EditorContext } from "comps/editorState";
@@ -49,7 +49,7 @@ const childrenMap = {
   viewRef: RefControl<InputRef>,
   showCount: BoolControl,
   allowClear: BoolControl,
-  style: styleControl(InputFieldStyle),
+  style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
   labelStyle: styleControl(LabelStyle),
   prefixIcon: IconControl,
   suffixIcon: IconControl,

client/packages/lowcoder/src/comps/comps/textInputComp/passwordComp.tsx

@@ -57,7 +57,7 @@ let PasswordTmpComp = (function () {
     validationType: dropdownControl(TextInputValidationOptions, "Regex"),
     visibilityToggle: BoolControl.DEFAULT_TRUE,
     prefixIcon: IconControl,
-    style: styleControl(InputFieldStyle),
+    style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
     labelStyle: styleControl(LabelStyle),
     inputFieldStyle: styleControl(InputLikeStyle)
   };

client/packages/lowcoder/src/comps/comps/textInputComp/textAreaComp.tsx

@@ -71,7 +71,7 @@ let TextAreaTmpComp = (function () {
     viewRef: RefControl<TextAreaRef>,
     allowClear: BoolControl,
     autoHeight: withDefault(AutoHeightControl, "fixed"),
-    style: styleControl(InputFieldStyle),
+    style: withDefault(styleControl(InputFieldStyle), {borderWidth: '1px'}),
     labelStyle: styleControl(LabelStyle),
     inputFieldStyle: styleControl(InputLikeStyle)
   };