Add changes to disabled property for components (e.g TouchableHighlight)

change/@office-iss-react-native-win32-ab897e6a-366f-48e4-92bf-15e075bddf3e.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@office-iss/react-native-win32",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-automation-316a34d4-7a85-44db-8e1c-1c28942ece5b.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/automation",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-automation-channel-671125dd-88da-4be9-9181-6abb7a139013.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/automation-channel",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-automation-commands-d421efc1-5dc1-44a1-8bf2-7afbcd9f324e.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/automation-commands",
+  "email": "email not defined",
+  "dependentChangeType": "none"
+}

change/@react-native-windows-cli-06fce317-e302-4855-8fe3-b9b01f7b8be9.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/cli",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-codegen-d8cd2833-de01-4061-acf5-28ed3282d4d7.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/codegen",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-find-repo-root-c1656a59-2e1c-4934-87cf-60567cd1c709.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/find-repo-root",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-fs-bc19e2b8-9787-4aa7-b1c6-442835aac709.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/fs",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-package-utils-31be4293-42ae-4451-9150-3b2579034b14.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/package-utils",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@react-native-windows-telemetry-0deaba06-262a-448a-ab40-767e7f31d534.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@react-native-windows/telemetry",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@rnw-scripts-create-github-releases-5c7b092c-6361-48f9-8b34-505662aea0d4.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@rnw-scripts/create-github-releases",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@rnw-scripts-doxysaurus-2bdb72c2-e7f3-4cc6-b542-29b45ce6bc00.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@rnw-scripts/doxysaurus",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@rnw-scripts-integrate-rn-0c2eaf1e-83af-49be-a4df-1a500e666485.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@rnw-scripts/integrate-rn",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@rnw-scripts-promote-release-ca293f76-59b2-4fa3-9ae1-7a884cee3b1d.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@rnw-scripts/promote-release",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/@rnw-scripts-take-screenshot-a289b8d1-aa53-4fa6-8349-f74faff65b52.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "@rnw-scripts/take-screenshot",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/react-native-platform-override-b227fd49-f402-4e01-b3df-8a856eb20061.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "react-native-platform-override",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/react-native-windows-0de7f503-7520-4b3c-85ac-d7da20e29c6b.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Resolved nits",
+  "packageName": "react-native-windows",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

change/react-native-windows-init-3302d404-cfcc-486f-947a-7ef01c520ae2.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Merge branch 'YajurG-8875' of https://github.com/YajurG/react-native-windows into YajurG-8875",
+  "packageName": "react-native-windows-init",
+  "email": "email not defined",
+  "dependentChangeType": "patch"
+}

vnext/Microsoft.ReactNative/Views/ControlViewManager.cpp

@@ -30,6 +30,7 @@ void ControlViewManager::GetNativeProps(const winrt::Microsoft::ReactNative::IJS
   Super::GetNativeProps(writer);
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"tabIndex", L"number");
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"focusable", L"boolean");
+  winrt::Microsoft::ReactNative::WriteProperty(writer, L"disabled", L"boolean");
 }
 void ControlViewManager::TransferProperties(const XamlView &oldView, const XamlView &newView) {
   TransferProperty(oldView, newView, xaml::Controls::Control::FontSizeProperty());
@@ -86,6 +87,10 @@ bool ControlViewManager::UpdateProperty(
       } else if (propertyValue.IsNull()) {
         nodeToUpdate->IsFocusable(false);
       }
+    } else if (propertyName == "disabled") {
+      if (propertyValue.Type() == winrt::Microsoft::ReactNative::JSValueType::Boolean) {
+        nodeToUpdate->IsDisable(propertyValue.AsBoolean());
+      }
     } else {
       if (propertyName == "accessible") {
         if (propertyValue.Type() == winrt::Microsoft::ReactNative::JSValueType::Boolean) {
@@ -95,7 +100,6 @@ bool ControlViewManager::UpdateProperty(
       ret = Super::UpdateProperty(nodeToUpdate, propertyName, propertyValue);
     }
   }
-
   if (finalizeBorderRadius && control.try_as<xaml::Controls::IControl7>()) {
     // Control.CornerRadius is only supported on >= RS5, setting borderRadius on Controls have no effect < RS5
     UpdateCornerRadiusOnElement(nodeToUpdate, control);
@@ -124,7 +128,7 @@ void ControlViewManager::OnPropertiesUpdated(ShadowNodeBase *node) {
 
   // If developer specifies either the accessible and focusable prop to be false
   // remove accessibility and keyboard focus for component.
-  const auto isTabStop = (node->IsAccessible() && node->IsFocusable());
+  const auto isTabStop = !node->IsDisable() && (node->IsAccessible() && node->IsFocusable());
   const auto accessibilityView =
       isTabStop ? xaml::Automation::Peers::AccessibilityView::Content : xaml::Automation::Peers::AccessibilityView::Raw;
   control.IsTabStop(isTabStop);

vnext/Microsoft.ReactNative/Views/ShadowNodeBase.cpp

@@ -179,4 +179,11 @@ bool ShadowNodeBase::IsFocusable() {
   return m_isFocusable;
 }
 
+void ShadowNodeBase::IsDisable(bool disable) {
+  m_isDisabled = disable;
+}
+bool ShadowNodeBase::IsDisable() {
+  return m_isDisabled;
+}
+
 } // namespace Microsoft::ReactNative

vnext/Microsoft.ReactNative/Views/ShadowNodeBase.h

@@ -125,12 +125,15 @@ struct REACTWINDOWS_EXPORT ShadowNodeBase : public ShadowNode {
   bool IsAccessible();
   void IsFocusable(bool focusable);
   bool IsFocusable();
+  void IsDisable(bool disable);
+  bool IsDisable();
 
  protected:
   XamlView m_view;
   bool m_updating = false;
   bool m_isFocusable = true;
   bool m_isAccessible = true;
+  bool m_isDisabled = false;
   comp::CompositionPropertySet m_transformPS{nullptr};
 
  public:

vnext/Microsoft.ReactNative/Views/ViewViewManager.cpp

@@ -376,6 +376,7 @@ void ViewViewManager::GetNativeProps(const winrt::Microsoft::ReactNative::IJSVal
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"focusable", L"boolean");
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"enableFocusRing", L"boolean");
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"tabIndex", L"number");
+  winrt::Microsoft::ReactNative::WriteProperty(writer, L"disabled", L"boolean");
   winrt::Microsoft::ReactNative::WriteProperty(writer, L"collapsable", L"boolean");
 }
 
@@ -437,6 +438,9 @@ bool ViewViewManager::UpdateProperty(
       if (propertyName == "accessible") {
         pViewShadowNode->IsAccessible(propertyValue.AsBoolean());
       }
+      if (propertyName == "disabled") {
+        pViewShadowNode->IsDisable(propertyValue.AsBoolean());
+      }
       ret = Super::UpdateProperty(nodeToUpdate, propertyName, propertyValue);
     }
   }
@@ -462,8 +466,10 @@ void ViewViewManager::OnPropertiesUpdated(ShadowNodeBase *node) {
 
   // If component is focusable, it should be a ViewControl.
   // If component is a View with accessible set to true, the component should be focusable, thus we need a ViewControl.
-  bool shouldBeControl =
-      (viewShadowNode->IsFocusable() || (viewShadowNode->IsAccessible() && !viewShadowNode->OnClick()));
+  bool shouldBeControl = viewShadowNode->IsDisable()
+      ? false
+      : ((viewShadowNode->IsFocusable() || (viewShadowNode->IsAccessible() && !viewShadowNode->OnClick())));
+
   if (auto view = viewShadowNode->GetView().try_as<xaml::UIElement>()) {
     // If we have DynamicAutomationProperties, we need a ViewControl with a
     // DynamicAutomationPeer
@@ -597,8 +603,10 @@ void ViewViewManager::SyncFocusableAndAccessible(ViewShadowNode *pViewShadowNode
     const auto isFocusable = pViewShadowNode->IsFocusable();
     const auto isAccessible = pViewShadowNode->IsAccessible();
     const auto isPressable = pViewShadowNode->OnClick();
+    const auto isDisabled = pViewShadowNode->IsDisable();
     const auto isTabStop =
-        (isPressable && isFocusable && isAccessible) || (!isPressable && (isFocusable || isAccessible));
+        (!isDisabled &&
+         ((isPressable && isFocusable && isAccessible) || (!isPressable && (isFocusable || isAccessible))));
     const auto accessibilityView = isTabStop ? xaml::Automation::Peers::AccessibilityView::Content
                                              : xaml::Automation::Peers::AccessibilityView::Raw;
     pViewShadowNode->GetControl().IsTabStop(isTabStop);

vnext/src/Libraries/Components/Touchable/TouchableHighlight.windows.js

@@ -324,6 +324,7 @@ class TouchableHighlight extends React.Component<Props, State> {
         accessibilityValue={accessibilityValue}
         accessibilityActions={this.props.accessibilityActions}
         onAccessibilityAction={this.props.onAccessibilityAction}
+        disabled={this.props.disabled}
         importantForAccessibility={
           this.props['aria-hidden'] === true
             ? 'no-hide-descendants'

vnext/src/Libraries/Components/Touchable/TouchableOpacity.windows.js

@@ -281,6 +281,7 @@ class TouchableOpacity extends React.Component<Props, State> {
         accessibilityElementsHidden={
           this.props['aria-hidden'] ?? this.props.accessibilityElementsHidden
         }
+        disabled={this.props.disabled}
         style={[this.props.style, {opacity: this.state.anim}]}
         nativeID={this.props.nativeID}
         testID={this.props.testID}

vnext/src/Libraries/Components/View/View.windows.js

@@ -56,6 +56,7 @@ const View: React.AbstractComponent<
       'aria-valuenow': ariaValueNow,
       'aria-valuetext': ariaValueText,
       focusable,
+      disabled,
       id,
       importantForAccessibility,
       nativeID,
@@ -205,6 +206,7 @@ const View: React.AbstractComponent<
               }
               accessibilityLabel={ariaLabel ?? accessibilityLabel}
               focusable={tabIndex !== undefined ? !tabIndex : focusable}
+              disabled={disabled}
               accessibilityState={_accessibilityState}
               accessibilityRole={
                 role ? getAccessibilityRoleFromRole(role) : accessibilityRole

vnext/src/Libraries/Components/View/ViewPropTypes.windows.js

@@ -465,6 +465,8 @@ type WindowsViewProps = $ReadOnly<{|
 
   tabIndex?: ?number,
 
+  disabled?: ?boolean,
+
   accessibilityPosInSet?: ?number,
   accessibilitySetSize?: ?number,