[all hosts] (UI/UX) Copy a UI sample from the conceptual docs (#2301)

* Copy a UI sample from the conceptual docs

* Update docs/code-snippets/office-snippets.yaml

Co-authored-by: Sam Ramon <[email protected]>

---------

Co-authored-by: Sam Ramon <[email protected]>

Author: AlexJerabek

docs/code-snippets/office-snippets.yaml

@@ -1290,6 +1290,17 @@ Office.ContextMenuUpdaterData#controls:member:
             },
         ]
     });
+Office.Control:interface:
+  - |-
+    // This snippet enables a control (a button) in a custom ribbon tab.
+    // Note that "MyButton", "OfficeAddinTab1", and "CustomGroup111" are defined in the manifest.
+    const enableButton = async () => {
+        const button: Control = { id: "MyButton", enabled: true };
+        const parentGroup: Group = { id: "CustomGroup111", controls: [button] };
+        const parentTab: Tab = { id: "OfficeAddinTab1", groups: [parentGroup] };
+        const ribbonUpdater: RibbonUpdaterData = { tabs: [parentTab] };
+        Office.ribbon.requestUpdate(ribbonUpdater);
+    }
 Office.CustomXmlNode#baseName:member:
   - |-
     function showXmlNodeBaseNames() {