From 28680d74f552ad713cbbfce4c2054b6b543b5a42 Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Sun, 18 Aug 2024 00:02:07 +0200
Subject: [PATCH] [pickers][docs] Fix missing leading slashes in URLs

---
 .../components/overview/CommunityOrPro.tsx    |  4 +--
 .../overview/Internationalization.tsx         |  6 ++--
 .../modules/components/overview/Keyboard.tsx  | 33 +++++++++----------
 3 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/docs/src/modules/components/overview/CommunityOrPro.tsx b/docs/src/modules/components/overview/CommunityOrPro.tsx
index 8354913498836..3e6dc197bf71a 100644
--- a/docs/src/modules/components/overview/CommunityOrPro.tsx
+++ b/docs/src/modules/components/overview/CommunityOrPro.tsx
@@ -60,7 +60,7 @@ export default function CommunityOrPro() {
                 'Free forever under an MIT license. Includes Date Pickers, Time Pickers, and Date Time Pickers.',
               ]}
               backgroundColor="subtle"
-              link="/pricing/"
+              link="https://mui.com/pricing/"
             />
           </Box>
           <Box sx={{ flexBasis: '50%' }}>
@@ -71,7 +71,7 @@ export default function CommunityOrPro() {
                 'Requires a commercial license. Includes all Community components plus the Date and Time Range Pickers.',
               ]}
               backgroundColor="subtle"
-              link="/pricing/"
+              link="https://mui.com/pricing/"
             />
           </Box>
         </Stack>
diff --git a/docs/src/modules/components/overview/Internationalization.tsx b/docs/src/modules/components/overview/Internationalization.tsx
index a78b12fb53490..b0f898001d8a4 100644
--- a/docs/src/modules/components/overview/Internationalization.tsx
+++ b/docs/src/modules/components/overview/Internationalization.tsx
@@ -112,7 +112,7 @@ function TimezonesDemo() {
 
   return (
     <LocalizationProvider dateAdapter={AdapterDayjs}>
-      <DemoWrapper link="/x/react-date-pickers/timezone">
+      <DemoWrapper link="/x/react-date-pickers/timezone/">
         <Stack
           spacing={2}
           flexGrow={1}
@@ -230,7 +230,7 @@ function LanguagesDemo() {
             selectedLanguage={selectedLanguage}
           />
         }
-        link="/x/react-date-pickers/localization"
+        link="/x/react-date-pickers/localization/"
       >
         <ThemeProvider theme={theme}>
           <Stack
@@ -290,7 +290,7 @@ function ValidationDemo() {
 
   return (
     <LocalizationProvider dateAdapter={AdapterDayjs}>
-      <DemoWrapper link="/x/react-date-pickers/validation">
+      <DemoWrapper link="/x/react-date-pickers/validation/">
         <ThemeProvider theme={theme}>
           <Stack
             spacing={2}
diff --git a/docs/src/modules/components/overview/Keyboard.tsx b/docs/src/modules/components/overview/Keyboard.tsx
index 78ab99afc94f4..3d9fe387525ca 100644
--- a/docs/src/modules/components/overview/Keyboard.tsx
+++ b/docs/src/modules/components/overview/Keyboard.tsx
@@ -316,11 +316,11 @@ export function KeyboardSvg({ selectedKey, handleKeySelection }: KeyboardSvgProp
                         selectedKey.key.toLowerCase() === label.toLowerCase() &&
                         selectedKey.location === location,
                     })}
-                    onMouseDown={(e) => {
+                    onMouseDown={(event) => {
                       if (shouldSelect) {
-                        e.preventDefault();
+                        event.preventDefault();
 
-                        handleKeySelection(e, {
+                        handleKeySelection(event, {
                           key: label,
                           location: location || 0,
                           code: code || label,
@@ -328,9 +328,9 @@ export function KeyboardSvg({ selectedKey, handleKeySelection }: KeyboardSvgProp
                         });
                       }
                     }}
-                    onMouseUp={(e) => {
+                    onMouseUp={(event) => {
                       if (shouldSelect) {
-                        handleKeySelection(e, null);
+                        handleKeySelection(event, null);
                       }
                     }}
                   >
@@ -370,12 +370,12 @@ export function KeyboardSvg({ selectedKey, handleKeySelection }: KeyboardSvgProp
               className={clsx(key, 'key-root', {
                 selected: selectedKey && selectedKey.key.toLowerCase() === key.toLowerCase(),
               })}
-              onMouseDown={(e) => {
-                e.preventDefault();
-                handleKeySelection(e, { key, location, code, keyCode });
+              onMouseDown={(event) => {
+                event.preventDefault();
+                handleKeySelection(event, { key, location, code, keyCode });
               }}
-              onMouseUp={(e) => {
-                handleKeySelection(e, null);
+              onMouseUp={(event) => {
+                handleKeySelection(event, null);
               }}
             >
               <KeyRectangle
@@ -400,7 +400,7 @@ type SelectedKey = {
   code?: string;
   keyCode?: number;
 };
-type HandleKeySelection = (e: React.SyntheticEvent, key: SelectedKey | null) => void;
+type HandleKeySelection = (event: React.SyntheticEvent, key: SelectedKey | null) => void;
 
 export default function Keyboard() {
   const [selectedKey, setSelectedKey] = React.useState<SelectedKey | null>(null);
@@ -463,10 +463,9 @@ export default function Keyboard() {
             }
             description="The MUI X Date Pickers feature advanced keyboard support that's compliant with WCAG and WAI-ARIA standards, so users who require assistive technology can navigate your interface with ease."
           />
-
           <Button
             size="small"
-            href="/x/react-date-pickers/accessibility"
+            href="/x/react-date-pickers/accessibility/"
             endIcon={<ArrowForwardIcon />}
             sx={{ width: 'fit-content' }}
           >
@@ -478,11 +477,11 @@ export default function Keyboard() {
             <DateField
               defaultValue={dayjs('12/12/2023')}
               ref={ref}
-              onKeyDown={(e: React.KeyboardEvent) => {
+              onKeyDown={(event: React.KeyboardEvent) => {
                 setSelectedKey({
-                  key: e.key,
-                  code: e.code,
-                  location: e.location,
+                  key: event.key,
+                  code: event.code,
+                  location: event.location,
                 });
               }}
               onKeyUp={() => {