Skip to content

Commit be7e61a

Browse files
balajis-qbbalajis-qb
committed
Merge branch 'main' into issue-5620/support-disabled
2 parents 496cb6e + a402024 commit be7e61a

File tree

228 files changed

+3618
-2351
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

228 files changed

+3618
-2351
lines changed

‎docs-site/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,6 @@
2727
</head>
2828
<body>
2929
<div id="root"></div>
30-
<script type="module" src="/src/index.jsx"></script>
30+
<script type="module" src="/src/index.tsx"></script>
3131
</body>
3232
</html>

‎docs-site/package.json‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@
44
"private": true,
55
"type": "module",
66
"dependencies": {
7+
"copy-to-clipboard": "^3.3.3",
78
"date-fns": "^4.1.0",
9+
"esbuild-wasm": "^0.25.10",
810
"highlight.js": "^11.11.1",
911
"lodash": "^4.17.21",
1012
"prism-react-renderer": "^2.4.1",
@@ -16,21 +18,26 @@
1618
},
1719
"scripts": {
1820
"start": "vite",
19-
"build": "vite build",
21+
"build": "tsc && vite build",
2022
"lint": "eslint .",
21-
"preview": "vite preview"
23+
"preview": "vite preview",
24+
"type-check": "tsc --noEmit"
2225
},
2326
"devDependencies": {
24-
"@eslint/js": "^9.35.0",
27+
"@eslint/js": "^9.36.0",
28+
"@types/lodash": "^4.17.0",
2529
"@types/react": "^19.1.13",
2630
"@types/react-dom": "^19.1.9",
31+
"@typescript-eslint/eslint-plugin": "^7.0.0",
32+
"@typescript-eslint/parser": "^7.0.0",
2733
"@vitejs/plugin-react": "^5.0.3",
28-
"eslint": "^9.35.0",
34+
"eslint": "^9.36.0",
2935
"eslint-plugin-react": "^7.37.5",
3036
"eslint-plugin-react-hooks": "^6.0.0",
31-
"eslint-plugin-react-refresh": "^0.4.20",
37+
"eslint-plugin-react-refresh": "^0.4.22",
3238
"globals": "^16.4.0",
33-
"sass": "^1.92.1",
39+
"sass": "^1.93.2",
40+
"typescript": "^5.7.2",
3441
"vite": "^7.1.6"
3542
},
3643
"packageManager": "[email protected]"

‎docs-site/src/components/App/Toast.tsx‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import React, { useState, useEffect, useRef } from "react";
2+
import { createPortal } from "react-dom";
3+
4+
import "./toast.scss";
5+
6+
type ToastType = "success" | "error";
7+
8+
let showToastFn: ((message: string, type: ToastType) => void) | null;
9+
10+
export const toast = {
11+
show: (message: string, type: ToastType) => {
12+
if (showToastFn) {
13+
showToastFn(message, type);
14+
}
15+
},
16+
};
17+
18+
const Toast = (): React.ReactPortal | null => {
19+
const [toastMeta, setToastMeta] = useState<{
20+
message: string;
21+
type?: ToastType;
22+
}>({
23+
message: "",
24+
});
25+
const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
26+
27+
const clearTimer = () => {
28+
if (timerRef.current) {
29+
clearTimeout(timerRef.current);
30+
}
31+
};
32+
33+
const scheduleToastReset = () => {
34+
clearTimer();
35+
timerRef.current = setTimeout(() => {
36+
setToastMeta({ message: "" });
37+
}, 3000);
38+
};
39+
40+
useEffect(() => {
41+
showToastFn = (message: string, type: ToastType) => {
42+
setToastMeta({ message, type });
43+
scheduleToastReset();
44+
};
45+
46+
return () => {
47+
clearTimer();
48+
showToastFn = null;
49+
};
50+
}, []);
51+
52+
const { message, type } = toastMeta;
53+
if (!message?.trim()) return null;
54+
55+
return createPortal(
56+
<div className={`toast toast--${type}`}>{message}</div>,
57+
document.body,
58+
);
59+
};
60+
61+
export default Toast;

‎docs-site/src/components/App/index.jsx‎ renamed to ‎docs-site/src/components/App/index.tsx‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,22 @@
11
import { useEffect, useState } from "react";
22
import DatePicker from "react-datepicker";
33
import ExampleComponents from "../Examples";
4+
import Toast from "./Toast";
5+
import { initializeTsxTransformer } from "../tsxTransformer";
46
import logo from "./logo.png";
57
import ribbon from "./ribbon.png";
68

7-
const Example = () => {
8-
const [isOpen, setIsOpen] = useState(true);
9-
const [startDate, setStartDate] = useState(new Date());
10-
const [isScrolled, setIsScrolled] = useState(true);
9+
const Example: React.FC = () => {
10+
const [isOpen, setIsOpen] = useState<boolean>(true);
11+
const [startDate, setStartDate] = useState<Date | null>(new Date());
12+
const [isScrolled, setIsScrolled] = useState<boolean>(true);
1113

1214
useEffect(() => {
13-
const handleScroll = () => setIsScrolled(window.scrollY < 400);
15+
const handleScroll = (): void => setIsScrolled(window.scrollY < 400);
1416
document.addEventListener("scroll", handleScroll);
1517

18+
initializeTsxTransformer();
19+
1620
return () => {
1721
document.removeEventListener("scroll", handleScroll);
1822
};
@@ -22,7 +26,7 @@ const Example = () => {
2226
<DatePicker
2327
open={isOpen && isScrolled}
2428
selected={startDate}
25-
onChange={(date) => {
29+
onChange={(date: Date | null) => {
2630
setStartDate(date);
2731
setIsOpen(false);
2832
}}
@@ -31,7 +35,7 @@ const Example = () => {
3135
);
3236
};
3337

34-
const Root = () => (
38+
const Root: React.FC = () => (
3539
<div>
3640
<div className="hero">
3741
<div className="hero__content">
@@ -107,6 +111,8 @@ const Root = () => (
107111
<a href="https://github.com/Hacker0x01/react-datepicker/">
108112
<img className="github-ribbon" src={ribbon} alt="Fork me on GitHub" />
109113
</a>
114+
115+
<Toast />
110116
</div>
111117
);
112118

‎docs-site/src/components/App/toast.scss‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
$toast-success-color: #009688;
2+
$toast-error-color: #ef5350;
3+
4+
.toast {
5+
position: fixed;
6+
bottom: 20px;
7+
left: 50%;
8+
transform: translateX(-50%);
9+
10+
display: inline-block;
11+
color: #fff;
12+
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
13+
border-radius: 5px;
14+
padding: 10px 20px;
15+
font-size: 14px;
16+
font-weight: 600;
17+
text-align: center;
18+
z-index: 1000;
19+
20+
&--success {
21+
background-color: $toast-success-color;
22+
}
23+
24+
&--error {
25+
background-color: $toast-error-color;
26+
}
27+
}

‎docs-site/src/components/Example/copy.svg‎

Lines changed: 3 additions & 0 deletions
Loading

‎docs-site/src/components/Example/index.jsx‎

Lines changed: 0 additions & 66 deletions
This file was deleted.

0 commit comments

Comments
 (0)