diff --git a/src/components/DatePicker.jsx b/src/components/DatePicker.jsx index e94067f6a..45bdea44e 100644 --- a/src/components/DatePicker.jsx +++ b/src/components/DatePicker.jsx @@ -43,6 +43,7 @@ const DatePicker = forwardRef( defaultValue, value, labelProps, + required = false, ...otherProps }, ref @@ -63,7 +64,11 @@ const DatePicker = forwardRef( return (
- {label && } + {label && ( + + )} ; +DateInput.args = { + label: "Required Date", + type: "date", + picker: "date", + showTime: false, + required: true +}; +DateInput.storyName = "Required Date"; + const DatePickerWithRef = args => { const ref = React.useRef(); const [open, setOpen] = React.useState(false); @@ -209,6 +219,7 @@ export { DateRangePicker, DateRangePickerWithPresetRanges, ShowTime, + RequiredDatePicker }; export default metadata; diff --git a/tests/DatePicker.test.jsx b/tests/DatePicker.test.jsx index 17998d3b4..2a3428b12 100644 --- a/tests/DatePicker.test.jsx +++ b/tests/DatePicker.test.jsx @@ -109,4 +109,10 @@ describe("DatePicker", () => { expect(dateInputBox[0]).toHaveValue("11/04/2022"); expect(dateInputBox[1]).toHaveValue("16/05/2022"); }); + + it("should render asterisk when required is set to true", () => { + const { getByText } = render(); + const asterisk = getByText("*"); + expect(asterisk).toBeInTheDocument(); + }); });