refactor number field events

Author: HackGenesis

shesha-reactjs/src/designer-components/numberField/control.tsx

@@ -43,8 +43,6 @@ const NumberFieldControl: FC<IProps> = ({ disabled, model, onChange, value, onBl
   const [backgroundStyles, setBackgroundStyles] = useState({});
   const shadowStyles = useMemo(() => getShadowStyle(shadow), [shadow]);
 
-  console.log('model?.highPrecision', model?.highPrecision);
-
   useEffect(() => {
     const fetchStyles = async () => {
       const storedImageUrl =
@@ -120,7 +118,6 @@ const NumberFieldControl: FC<IProps> = ({ disabled, model, onChange, value, onBl
     ),
   };
 
-  console.log({ ...inputProps });
 
   return (
     <ConfigProvider
@@ -138,7 +135,7 @@ const NumberFieldControl: FC<IProps> = ({ disabled, model, onChange, value, onBl
       <InputNumber
         value={value ?? model?.defaultValue}
         {...inputProps}
-        stringMode={false}
+        stringMode={!model?.highPrecision}
         style={{ ...finalStyle, ...jsStyle }}
         className={`sha-input ${styles.numberField}`}
         onBlur={onBlur}

shesha-reactjs/src/designer-components/numberField/numberField.tsx

@@ -56,25 +56,6 @@ const NumberFieldComponent: IToolboxComponent<INumberFieldComponentProps> = {
       >
         {(value, onChange) => {
           const customEvents = getEventHandlers(model, allData);
-
-          const onChangeInternal = (...args: any[]) => {
-            // Handle the case where the user clears the input
-            if (args[0] === null) {
-              // Fire custom event with `null` or fallback value
-              customEvents.onChange({ target: { value: null } } as unknown as React.ChangeEvent<HTMLInputElement>);
-
-              if (typeof onChange === 'function') onChange(null);
-              return;
-            }
-
-            // Handle normal case where args[0] is a valid number
-            customEvents.onChange({
-              target: { value: args[0] },
-            } as unknown as React.ChangeEvent<HTMLInputElement>);
-
-            if (typeof onChange === 'function') onChange(...args);
-          };
-
           return model.readOnly ? (
             <ReadOnlyDisplayFormItem
               type="number"
@@ -85,7 +66,7 @@ const NumberFieldComponent: IToolboxComponent<INumberFieldComponentProps> = {
               disabled={model.readOnly}
               model={model}
               value={value}
-              onChange={onChangeInternal}
+              onChange={onChange}
               onBlur={customEvents.onBlur}
               onFocus={customEvents.onFocus}
             />

shesha-reactjs/src/designer-components/numberField/settingsForm.ts

@@ -161,15 +161,50 @@ export const getSettings = (data: INumberFieldComponentProps) => {
                   defaultValue: false,
                 })
 
-                .addSettingsInput({
-                  id: '874aa450-6274-48d4-8032-395fdd680fa5',
-                  inputType: 'numberField',
-                  propertyName: 'stepNumeric',
-                  parentId: 'jNmEKg7HtYXwaL9CylTOX',
-                  label: 'Step',
-                  defaultValue: 1,
-                  validate: {},
-                  settingsValidationErrors: [],
+                .addSettingsInputRow({
+                  id: 'type-default-value-s4gmBg31azZC0UjZjpfTm',
+                  parentId: 's4gmBg31azZC0UjZjpfTm',
+                  readOnly: { _code: 'return  getSettingValue(data?.readOnly);', _mode: 'code', _value: false } as any,
+                  hidden: {
+                    _code: 'return getSettingValue(data?.highPrecision)',
+                    _mode: 'code',
+                    _value: false,
+                  },
+                  inputs: [
+                    {
+                      id: '874aa450-6274-48d4-8032-395fdd680fa5',
+                      type: 'numberField',
+                      propertyName: 'stepNumeric',
+                      parentId: 'jNmEKg7HtYXwaL9CylTOX',
+                      label: 'Step',
+                      defaultValue: 1,
+                      validate: {},
+                      settingsValidationErrors: [],
+                    },
+                  ],
+                })
+
+                .addSettingsInputRow({
+                  id: 'type-default-value-s4gmBg31azZC0UjZjpfTm',
+                  parentId: 's4gmBg31azZC0UjZjpfTm',
+                  readOnly: { _code: 'return  getSettingValue(data?.readOnly);', _mode: 'code', _value: false } as any,
+                  hidden: {
+                    _code: 'return !getSettingValue(data?.highPrecision)',
+                    _mode: 'code',
+                    _value: false,
+                  } as any,
+                  inputs: [
+                    {
+                      id: '874aa450-6274-48d4-8032-395fdd680fa5',
+                      type: 'textField',
+                      propertyName: 'stepString',
+                      parentId: 'jNmEKg7HtYXwaL9CylTOX',
+                      label: 'Step',
+                      defaultValue: 0.1,
+                      validate: {},
+                      settingsValidationErrors: [],
+                    },
+                  ],
                 })
 
                 .toJson(),
@@ -199,15 +234,15 @@ export const getSettings = (data: INumberFieldComponentProps) => {
                     {
                       type: 'numberField',
                       id: 'minLength-s4gmBg31azZC0UjZjpfTm',
-                      propertyName: 'validate.minLength',
+                      propertyName: 'validate.minValue',
                       label: 'Min Value',
                       size: 'small',
                       jsSetting: true,
                     },
                     {
                       type: 'numberField',
                       id: 'maxLength-s4gmBg31azZC0UjZjpfTm',
-                      propertyName: 'validate.maxLength',
+                      propertyName: 'validate.maxValue',
                       label: 'Max Value',
                       size: 'small',
                       jsSetting: true,