Add new tests and get all passing

src/antd/InputNumber.tsx

@@ -18,15 +18,17 @@ export const InputNumber = (props: InputNumberProps): InputNumber => {
         (typeof numberType === "string" && numberType === "integer")
         || (Array.isArray(numberType) && numberType.includes("integer"))
       ) {
-        props.handleChange(props.path, value !== null ? coerceToInteger(value) : value)
+        props.handleChange(props.path, coerceToInteger(value))
       } else {
-        props.handleChange(props.path, value !== null ? coerceToNumber(value) : value)
+        props.handleChange(props.path, coerceToNumber(value))
       }
+    } else {
+      props.handleChange(props.path, value)
     }
   }
 
-  const min = schema.properties?.minimum as number | undefined
-  const max = schema.properties?.maximum as number | undefined
+  const min = schema.minimum
+  const max = schema.maximum
 
   const defaultValue = typeof schema?.default === "number" ? schema.default : undefined
 
@@ -38,7 +40,8 @@ export const InputNumber = (props: InputNumberProps): InputNumber => {
   const addonBefore = props.uischema.options?.addonBefore as string | undefined
   const isPercentage = addonAfter?.trim() === "%"
 
-  const style = { marginLeft: 0, width: "100%" }
+  const marginLeft = min !== undefined && max !== undefined ? 16 : 0
+  const style = { marginLeft: marginLeft, width: "100%" }
   const formatter = ((value?: number) => {
     if (typeof value !== "undefined") {
       if (isPercentage) {

src/controls/NumericControls/NumericControl.test.tsx

@@ -9,6 +9,8 @@ import {
   numericWeightSchema,
   numericUISchema,
   numericUISchemaWithRule,
+  numericPriceSchema,
+  numericUSDUISchema,
 } from "../../testSchemas/numericSchema/numericSchema"
 
 
@@ -113,4 +115,23 @@ describe("NumericControl", () => {
       expect(data).toEqual({ numericValue: 123 })
     })
   })
+
+  it ("shows error message onBlur when field is required and empty", async () => {
+    render({
+      schema: numericTheNumberSchema,
+      uischema: numericUISchema,
+    })
+    const input = screen.getByRole("spinbutton")
+    await userEvent.clear(input)
+    await userEvent.tab()
+    expect(await screen.findByText("The Number is required")).not.toBeNull()
+  })
+
+  it ("shows units next to text input if set in UI schema", async () => {
+    render({
+      schema: numericPriceSchema,
+      uischema: numericUSDUISchema,
+    })
+    expect(await screen.findByText("$")).not.toBeNull()
+  })
 })

src/controls/NumericControls/NumericControl.tsx

@@ -10,7 +10,7 @@ export const NumericControl = (props: ControlProps & RendererProps) => {
   const initialValue = typeof props.schema.default === "number" ? props.schema.default : undefined
 
   const rules: Rule[] = [
-    { message: props.required ? `${props.label} is required` : "" },
+    { required: true, message: `${props.label} is required` },
   ]
 
   return (

src/controls/NumericControls/NumericSliderControl.test.tsx

@@ -5,8 +5,9 @@ import { render } from "../../common/test-render"
 import { JSONSchema } from "json-schema-to-ts"
 import {
   numericSliderBasisPointsSchema,
-  numericSliderFinalGradeSchema,
   numericSliderUISchema,
+  numericSliderFinalGradeSchema,
+  numericSliderPercentageUISchema,
   numericSliderUISchemaWithRule,
 } from "../../testSchemas/numericSchema/numericSliderSchema"
 
@@ -82,4 +83,16 @@ describe("NumericSliderControl", () => {
       expect(data).toEqual({ numericRangeValue: 42.00 })
     })
   })
+
+  it ("shows units in tooltip if set in UI schema", async () => {
+    render({
+      schema: numericSliderFinalGradeSchema,
+      uischema: numericSliderPercentageUISchema,
+    })
+    const slider = screen.getByRole("slider")
+    expect(screen.queryByText("50%")).toBeNull()
+    await userEvent.hover(slider)
+
+    expect(screen.queryByText("50%")).not.toBeNull()
+  })
 })

src/controls/NumericControls/NumericSliderControl.tsx

@@ -11,7 +11,7 @@ export const NumericSliderControl = (props: ControlProps & RendererProps) => {
   const initialValue = typeof props.schema.default === "number" ? props.schema.default : undefined
 
   const rules: Rule[] = [
-    { message: props.required ? `${props.label} is required` : "" },
+    { required: true, message: `${props.label} is required` },
   ]
 
   return (

src/testSchemas/numericSchema/numericSliderSchema.ts

@@ -25,6 +25,7 @@ export const numericSliderTemperatureSchema = {
       minimum: -50,
       maximum: 150,
       multipleOf: 1,
+      default: 70,
     },
   },
   required: ["numericRangeValue"],
@@ -67,6 +68,7 @@ export const numericSliderFinalGradeSchema = {
       type: "number",
       minimum: 0.0,
       maximum: 1.0,
+      multipleOf: 0.01,
       default: 0.5,
     },
   },
@@ -82,8 +84,8 @@ export const numericSliderDonateNowSchema = {
       title: "Donate Now",
       minimum: 5.00,
       maximum: 1000.00,
-      default: 20.00,
       multipleOf: 5.00,
+      default: 20.00,
     }
   },
   required: ["numericRangeValue"],

tsconfig.cjs.json

@@ -3,7 +3,9 @@
     "compilerOptions": {
         "lib": [
             "ES6",
-            "DOM"
+            "ES2020",
+            "DOM",
+            "DOM.Iterable",
         ],
         "target": "ES6",
         "module": "CommonJS",

tsconfig.esm.json

@@ -3,7 +3,8 @@
     "compilerOptions": {
         "lib": [
             "ES2022",
-            "DOM"
+            "DOM",
+            "DOM.Iterable",
         ],
         "target": "ES2022",
         "module": "NodeNext",

tsconfig.production.json

@@ -12,13 +12,7 @@
         "declarationMap": true,
         "allowSyntheticDefaultImports": true,
 
-        "target": "ES2020",
         "useDefineForClassFields": true,
-        "lib": [
-            "ES2020",
-            "DOM",
-            "DOM.Iterable"
-        ],
         "module": "ESNext",
         "skipLibCheck": true,
         "esModuleInterop": true,