From 70a8864d1686a8761556fe209ca537f2ffb02649 Mon Sep 17 00:00:00 2001
From: Muhammed Osman <91621437+Muh-Osman@users.noreply.github.com>
Date: Thu, 1 Jun 2023 16:35:36 +0300
Subject: [PATCH 1/4] translate option page

---
 .../reference/react-dom/components/option.md  | 66 +++++++++++--------
 1 file changed, 39 insertions(+), 27 deletions(-)

diff --git a/src/content/reference/react-dom/components/option.md b/src/content/reference/react-dom/components/option.md
index 8d930523f..c3b73af8f 100644
--- a/src/content/reference/react-dom/components/option.md
+++ b/src/content/reference/react-dom/components/option.md
@@ -4,12 +4,16 @@ title: "<option>"
 
 <Intro>
 
-The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) lets you render an option inside a [`<select>`](/reference/react-dom/components/select) box.
+<div dir="rtl">
+
+يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
+
+</div>
 
 ```js
 <select>
-  <option value="someOption">Some option</option>
-  <option value="otherOption">Other option</option>
+  <option value="someOption">بعض الخيارات</option>
+  <option value="otherOption">خيارات أخرى</option>
 </select>
 ```
 
@@ -19,56 +23,65 @@ The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/
 
 ---
 
-## Reference {/*reference*/}
+<div dir="rtl">
+
+## المرجع {/*reference*/}
 
 ### `<option>` {/*option*/}
 
-The [built-in browser `<option>` component](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) lets you render an option inside a [`<select>`](/reference/react-dom/components/select) box.
+يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
+</div>
 
 ```js
 <select>
-  <option value="someOption">Some option</option>
-  <option value="otherOption">Other option</option>
+  <option value="someOption">بعض الخيارات</option>
+  <option value="otherOption">خيارات أخرى</option>
 </select>
 ```
 
-[See more examples below.](#usage)
+<div dir="rtl">
+
+[انظر الى المزيد من الأمثلة في الأسفل.](#usage)
 
-#### Props {/*props*/}
+#### الخواص {/*props*/}
 
-`<option>` supports all [common element props.](/reference/react-dom/components/common#props)
+تدعم `<option>` [جميع خواص العناصر الشائعة.](/reference/react-dom/components/common#props)
 
-Additionally, `<option>` supports these props:
+بالإضافة إلى ذلك ، يدعم `<option>` هذه الخواص:
 
-* [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#disabled): A boolean. If `true`, the option will not be selectable and will appear dimmed.
-* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): A string. Specifies the meaning of the option. If not specified, the text inside the option is used.
-* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#value): The value to be used [when submitting the parent `<select>` in a form](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) if this option is selected.
+* [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#disabled): قيمة منطقية. إذا كانت `true`، فلن يكون الخيار قابلاً للتحديد وسيظهر باهت.
 
-#### Caveats {/*caveats*/}
+* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): سلسلة. تحدد معنى الخيار. إذا لم يتم تحديدها ، فسيتم استخدام النص الموجود داخل الخيار.
 
-* React does not support the `selected` attribute on `<option>`. Instead, pass this option's `value` to the parent [`<select defaultValue>`](/reference/react-dom/components/select#providing-an-initially-selected-option) for an uncontrolled select box, or [`<select value>`](/reference/react-dom/components/select#controlling-a-select-box-with-a-state-variable) for a controlled select.
+* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#value): القيمة التي سيتم استخدامها [عند إرسال عنصر الأب `<select>` في النموذج](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) إذا تم تحديد هذا الخيار.
+
+#### تنبيه {/*caveats*/}
+
+* لا تدعم React سمة `selected` في `<option>`. بدلاً من ذلك ، قم بتمرير `value` هذا الخيار إلى العنصر الأب [`<select defaultValue>`](/reference/react-dom/components/select#providing-an-initially-selected-option)  وذلك لمربع تحديد غير متحكم فيه، أو [`<select value>`](/reference/react-dom/components/select#controlling-a-select-box-with-a-state-variable)  لمربع تحديد متحكم فيه.
 
 ---
 
-## Usage {/*usage*/}
+## الاستخدام {/*usage*/}
 
-### Displaying a select box with options {/*displaying-a-select-box-with-options*/}
+### عرض مربع التحديد مع الخيارات {/*displaying-a-select-box-with-options*/}
 
-Render a `<select>` with a list of `<option>` components inside to display a select box. Give each `<option>` a `value` representing the data to be submitted with the form.
+قم بإنشاء `<select>` يتضمن داخله قائمة من مكونات `<option>` لعرض مربع تحديد. أعط كل `<option>` قيمة `<value>` تمثل البيانات التي سيتم رفعها مع النموذج.
 
-[Read more about displaying a `<select>` with a list of `<option>` components.](/reference/react-dom/components/select)
+[اقرأ المزيد حول عرض `<select>` بقائمة مكونات `<option>`.](/reference/react-dom/components/select)
+
+</div>
 
 <Sandpack>
 
 ```js
 export default function FruitPicker() {
   return (
-    <label>
-      Pick a fruit:
+    <label dir= "rtl" >
+      اختر فاكهة:
       <select name="selectedFruit">
-        <option value="apple">Apple</option>
-        <option value="banana">Banana</option>
-        <option value="orange">Orange</option>
+        <option value="تفاح">تفاح</option>
+        <option value="موز">موز</option>
+        <option value="برتقال">برتقال</option>
       </select>
     </label>
   );
@@ -79,5 +92,4 @@ export default function FruitPicker() {
 select { margin: 5px; }
 ```
 
-</Sandpack>  
-
+</Sandpack>

From c1a31a172490386c5b44066c47ea029e089e34fc Mon Sep 17 00:00:00 2001
From: Muhammed Osman <91621437+Muh-Osman@users.noreply.github.com>
Date: Thu, 1 Jun 2023 23:07:36 +0300
Subject: [PATCH 2/4] Translate <option> page [UPDATED]

---
 .../reference/react-dom/components/option.md  | 31 ++++++-------------
 1 file changed, 10 insertions(+), 21 deletions(-)

diff --git a/src/content/reference/react-dom/components/option.md b/src/content/reference/react-dom/components/option.md
index c3b73af8f..b52051c0b 100644
--- a/src/content/reference/react-dom/components/option.md
+++ b/src/content/reference/react-dom/components/option.md
@@ -4,12 +4,8 @@ title: "<option>"
 
 <Intro>
 
-<div dir="rtl">
-
 يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
 
-</div>
-
 ```js
 <select>
   <option value="someOption">بعض الخيارات</option>
@@ -23,14 +19,11 @@ title: "<option>"
 
 ---
 
-<div dir="rtl">
-
 ## المرجع {/*reference*/}
 
 ### `<option>` {/*option*/}
 
 يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
-</div>
 
 ```js
 <select>
@@ -39,19 +32,17 @@ title: "<option>"
 </select>
 ```
 
-<div dir="rtl">
-
 [انظر الى المزيد من الأمثلة في الأسفل.](#usage)
 
-#### الخواص {/*props*/}
+#### الخصائص {/*props*/}
 
-تدعم `<option>` [جميع خواص العناصر الشائعة.](/reference/react-dom/components/common#props)
+تدعم `<option>` [جميع خصائص العناصر الشائعة.](/reference/react-dom/components/common#props)
 
-بالإضافة إلى ذلك ، يدعم `<option>` هذه الخواص:
+بالإضافة إلى ذلك ، يدعم `<option>` هذه الخصائص:
 
 * [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#disabled): قيمة منطقية. إذا كانت `true`، فلن يكون الخيار قابلاً للتحديد وسيظهر باهت.
 
-* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): سلسلة. تحدد معنى الخيار. إذا لم يتم تحديدها ، فسيتم استخدام النص الموجود داخل الخيار.
+* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): نص. يحدد معنى الخيار. إذا لم يتم تحديده ، فسيتم استخدام النص الموجود داخل الخيار.
 
 * [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#value): القيمة التي سيتم استخدامها [عند إرسال عنصر الأب `<select>` في النموذج](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) إذا تم تحديد هذا الخيار.
 
@@ -63,25 +54,23 @@ title: "<option>"
 
 ## الاستخدام {/*usage*/}
 
-### عرض مربع التحديد مع الخيارات {/*displaying-a-select-box-with-options*/}
+### عرض عنصر الاختيار مع الخيارات {/*displaying-a-select-box-with-options*/}
 
-قم بإنشاء `<select>` يتضمن داخله قائمة من مكونات `<option>` لعرض مربع تحديد. أعط كل `<option>` قيمة `<value>` تمثل البيانات التي سيتم رفعها مع النموذج.
+قم بإنشاء `<select>` يتضمن داخله قائمة من مكونات `<option>` لعرض مربع تحديد. أعط كل `<option>` قيمة `value` تمثل البيانات التي سيتم رفعها مع النموذج.
 
 [اقرأ المزيد حول عرض `<select>` بقائمة مكونات `<option>`.](/reference/react-dom/components/select)
 
-</div>
-
 <Sandpack>
 
 ```js
 export default function FruitPicker() {
   return (
-    <label dir= "rtl" >
+    <label>
       اختر فاكهة:
       <select name="selectedFruit">
-        <option value="تفاح">تفاح</option>
-        <option value="موز">موز</option>
-        <option value="برتقال">برتقال</option>
+        <option value="apple">تفاح</option>
+        <option value="banana">موز</option>
+        <option value="orange">برتقال</option>
       </select>
     </label>
   );

From 7314df6b965388ae34fd1015471f4ae3b1b47a01 Mon Sep 17 00:00:00 2001
From: Muhammed Osman <91621437+Muh-Osman@users.noreply.github.com>
Date: Thu, 1 Jun 2023 23:52:50 +0300
Subject: [PATCH 3/4] Translate <option> page [UPDATED]

---
 src/content/reference/react-dom/components/option.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/content/reference/react-dom/components/option.md b/src/content/reference/react-dom/components/option.md
index b52051c0b..0a43dd066 100644
--- a/src/content/reference/react-dom/components/option.md
+++ b/src/content/reference/react-dom/components/option.md
@@ -23,7 +23,7 @@ title: "<option>"
 
 ### `<option>` {/*option*/}
 
-يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
+يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
 
 ```js
 <select>

From 2aa4e54b2d2e882783e5b7c33402594bc3aac0a5 Mon Sep 17 00:00:00 2001
From: Ahmed Abdelbaset <A7med3bdulBaset@gmail.com>
Date: Fri, 2 Jun 2023 00:14:40 +0300
Subject: [PATCH 4/4] Update option.md

---
 src/content/reference/react-dom/components/option.md | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/content/reference/react-dom/components/option.md b/src/content/reference/react-dom/components/option.md
index 0a43dd066..b7ac26b80 100644
--- a/src/content/reference/react-dom/components/option.md
+++ b/src/content/reference/react-dom/components/option.md
@@ -4,7 +4,7 @@ title: "<option>"
 
 <Intro>
 
-يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
+يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option) عرض خيارات داخل عنصر [`<select>`](/reference/react-dom/components/select).
 
 ```js
 <select>
@@ -23,7 +23,7 @@ title: "<option>"
 
 ### `<option>` {/*option*/}
 
-يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) بعرض خيارات داخل مربع [`<select>`](/reference/react-dom/components/select).
+يتيح لك [مكون الـ `<option>` المدمج في المتصفح](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) عرض خيارات داخل عنصر [`<select>`](/reference/react-dom/components/select).
 
 ```js
 <select>
@@ -32,7 +32,7 @@ title: "<option>"
 </select>
 ```
 
-[انظر الى المزيد من الأمثلة في الأسفل.](#usage)
+[اطّلع على المزيد من الأمثلة في الأسفل.](#usage)
 
 #### الخصائص {/*props*/}
 
@@ -42,13 +42,13 @@ title: "<option>"
 
 * [`disabled`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#disabled): قيمة منطقية. إذا كانت `true`، فلن يكون الخيار قابلاً للتحديد وسيظهر باهت.
 
-* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): نص. يحدد معنى الخيار. إذا لم يتم تحديده ، فسيتم استخدام النص الموجود داخل الخيار.
+* [`label`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#label): نص. يحدد معنى الخيار. إذا لم يتم تحديده، فسيتم استخدام النص الموجود داخل الخيار.
 
-* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#value): القيمة التي سيتم استخدامها [عند إرسال عنصر الأب `<select>` في النموذج](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) إذا تم تحديد هذا الخيار.
+* [`value`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#value): القيمة التي سيتم استخدامها [عند إرسال العنصر الأب `<select>` في النموذج](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) إذا تم اختيار هذا الخيار.
 
 #### تنبيه {/*caveats*/}
 
-* لا تدعم React سمة `selected` في `<option>`. بدلاً من ذلك ، قم بتمرير `value` هذا الخيار إلى العنصر الأب [`<select defaultValue>`](/reference/react-dom/components/select#providing-an-initially-selected-option)  وذلك لمربع تحديد غير متحكم فيه، أو [`<select value>`](/reference/react-dom/components/select#controlling-a-select-box-with-a-state-variable)  لمربع تحديد متحكم فيه.
+* لا تدعم React سمة `selected` في `<option>`. بدلاً من ذلك، مرِّر قيمة `value` هذا الخيار إلى العنصر الأب في [`<select defaultValue>`](/reference/react-dom/components/select#providing-an-initially-selected-option) لعنصر اختيار غير متحكم فيه، أو في [`<select value>`](/reference/react-dom/components/select#controlling-a-select-box-with-a-state-variable)  لمعنصر اختيار متحكم فيه.
 
 ---