diff --git a/src/components/widgets/BaseInput.js b/src/components/widgets/BaseInput.js index 30afb03cda..698208e537 100644 --- a/src/components/widgets/BaseInput.js +++ b/src/components/widgets/BaseInput.js @@ -49,6 +49,14 @@ function BaseInput(props) { inputProps.step = schema.multipleOf; } + if (typeof schema.minimum !== "undefined") { + inputProps.min = schema.minimum; + } + + if (typeof schema.maximum !== "undefined") { + inputProps.max = schema.maximum; + } + const _onChange = ({ target: { value } }) => { return props.onChange(value === "" ? options.emptyValue : value); }; diff --git a/test/NumberField_test.js b/test/NumberField_test.js index ac2ee08aa0..42bb7f285d 100644 --- a/test/NumberField_test.js +++ b/test/NumberField_test.js @@ -308,6 +308,28 @@ describe("NumberField", () => { expect(node.querySelector("input").step).to.eql("5"); }); + + it("should use min to represent the minimum keyword", () => { + const { node } = createFormComponent({ + schema: { + type: "number", + minimum: 0, + }, + }); + + expect(node.querySelector("input").min).to.eql("0"); + }); + + it("should use max to represent the maximum keyword", () => { + const { node } = createFormComponent({ + schema: { + type: "number", + maximum: 100, + }, + }); + + expect(node.querySelector("input").max).to.eql("100"); + }); }); describe("SelectWidget", () => {