No Preview

Sorry, but you either have no stories or none are selected somehow.

If the problem persists, check the browser console, or the terminal you've run Storybook from.



max


A date string formatted as per the format prop.


This will prevent the user selecting a date after this date.


Example:


PropTypeValue
maxstring
"2025-07-08"
name*string
"field_name"
onChange*function
function handleOnChange(event, formatValue) {
  setValue(formatValue)
}
value*string
""


Implementation:


import React from "react";
import format from "date-fns/format";
import DateInput from "@idesigncode/date-input/DateInput.mjs";
import "@idesigncode/date-input/theme.css";
import "@idesigncode/date-input/layout.css";

const MaxExample = () => {
  const [value, setValue] = React.useState("");

  const handleOnChange = (event, formatValue) => {
    setValue(formatValue);
  };

  return (
    <DateInput
      max={format(new Date(), "yyyy-MM-dd")}
      name="field_name"
      onChange={handleOnChange}
      value={value}
    />
  );
};

export default MaxExample;