Merge branch 'master' into pr/3844

Author: martijnrusschen

CONTRIBUTING.md

@@ -24,7 +24,7 @@ Start reading our code, and you'll get the hang of it. We optimize for readabili
 
 Local development configuration is pretty snappy. Here's how to get set up:
 
-1. Install/use node >=11.10.1
+1. Install/use node >=16.0.0
 1. Run `yarn link` from project root
 1. Run `cd docs-site && yarn link react-datepicker`
 1. Run `yarn install` from project root

README.md

@@ -170,4 +170,4 @@ The examples are hosted within the docs folder and are ran in the simple app tha
 
 ## License
 
-Copyright (c) 2014-2021 HackerOne Inc. and individual contributors. Licensed under MIT license, see [LICENSE](LICENSE) for the full license.
+Copyright (c) 2014-2023 HackerOne Inc. and individual contributors. Licensed under MIT license, see [LICENSE](LICENSE) for the full license.

docs-site/package.json

@@ -32,7 +32,7 @@
     ]
   },
   "devDependencies": {
-    "sass": "^1.56.1",
+    "sass": "^1.57.1",
     "raw-loader": "^4.0.2"
   }
 }

docs-site/src/components/Examples/index.js

@@ -89,6 +89,7 @@ import CloseOnScrollCallback from "../../examples/closeOnScrollCallback";
 import SelectsRange from "../../examples/selectsRange";
 import selectsRangeWithDisabledDates from "../../examples/selectsRangeWithDisabledDates";
 import CalendarStartDay from "../../examples/calendarStartDay";
+import ExternalForm from "../../examples/externalForm";
 
 import "./style.scss";
 import "react-datepicker/dist/react-datepicker.css";
@@ -456,6 +457,10 @@ export default class exampleComponents extends React.Component {
       title: "Calendar Start day",
       component: CalendarStartDay,
     },
+    {
+      title: "External Form",
+      component: ExternalForm,
+    },
   ];
 
   handleAnchorClick = (e, id) => {

docs-site/src/examples/externalForm.js

@@ -0,0 +1,17 @@
+() => {
+  const [startDate, setStartDate] = useState(null);
+
+  return (
+    <>
+      <DatePicker
+        selected={startDate}
+        onChange={(date) => setStartDate(date)}
+        required
+        form="external-form"
+      />
+      <form id="external-form">
+        <input type="submit" />
+      </form>
+    </>
+  );
+};