From cd5d7adfc35d305251b9c820a51b97b81674f01d Mon Sep 17 00:00:00 2001
From: Mert Karaca <mert.karaca@mendix.com>
Date: Wed, 8 Oct 2025 10:16:09 +0200
Subject: [PATCH] Fix the compilation error of the code snippet

---
 .../pluggable-widgets/create-a-pluggable-widget-two.md    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/content/en/docs/howto/extensibility/pluggable-widgets/create-a-pluggable-widget-two.md b/content/en/docs/howto/extensibility/pluggable-widgets/create-a-pluggable-widget-two.md
index 240850117a2..96ac48b6a94 100644
--- a/content/en/docs/howto/extensibility/pluggable-widgets/create-a-pluggable-widget-two.md
+++ b/content/en/docs/howto/extensibility/pluggable-widgets/create-a-pluggable-widget-two.md
@@ -492,7 +492,7 @@ To make the input widget more accessible for people using screen readers, you wi
     Then add the `id` and `aria` attributes to be rendered:
 
     ```tsx
-    export function TextInput({ value, onLeave, tabIndex, style, className, disabled }: TextInputProps): ReactElement {
+    export function TextInput({ id, value, onLeave, tabIndex, style, className, disabled, hasError, required }: TextInputProps): ReactElement {
         const [state, setState] = useState<TextInputState>({ editedValue: undefined });
         useEffect(() => setState({ editedValue: undefined }), [value]);
         
@@ -516,9 +516,9 @@ To make the input widget more accessible for people using screen readers, you wi
                 disabled={disabled}
                 style={style}
                 tabIndex={tabIndex}
-                aria-labelledby={`${props.id}-label`}
-                aria-invalid={props.hasError}
-                aria-required={props.required}
+                aria-labelledby={`${id}-label`}
+                aria-invalid={hasError}
+                aria-required={required}
             />
         );
     }