Automatically generated docs (#2269)

Co-authored-by: github-actions <[email protected]>

Author: ElizabethSamuel-MSFT

docs/docs-ref-autogen/powerpoint/powerpoint/powerpoint.binding.yml

@@ -9,6 +9,28 @@ remarks: >-
   1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
   \]
 
+
+  #### Examples
+
+
+  ```TypeScript
+
+  // Link to full sample:
+  https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+  async function getShapeForBindingId(bindingId: string):
+  Promise<PowerPoint.Shape | undefined> {
+    // Gets shape associated with binding ID.
+    return PowerPoint.run(async (context) => {
+      const binding = context.presentation.bindings.getItem(bindingId);
+      const shape = binding.getShape();
+      return shape;
+    });
+  }
+
+  ```
+
 isPreview: false
 isDeprecated: false
 type: class
@@ -90,6 +112,28 @@ methods:
       1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
       \]
 
+
+      #### Examples
+
+
+      ```TypeScript
+
+      // Link to full sample:
+      https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+      async function getShapeForBindingId(bindingId: string):
+      Promise<PowerPoint.Shape | undefined> {
+        // Gets shape associated with binding ID.
+        return PowerPoint.run(async (context) => {
+          const binding = context.presentation.bindings.getItem(bindingId);
+          const shape = binding.getShape();
+          return shape;
+        });
+      }
+
+      ```
+
     isPreview: false
     isDeprecated: false
     syntax:

docs/docs-ref-autogen/powerpoint/powerpoint/powerpoint.bindingcollection.yml

@@ -11,6 +11,47 @@ remarks: >-
   1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
   \]
 
+
+  #### Examples
+
+
+  ```TypeScript
+
+  // Link to full sample:
+  https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+  // Loads bindings.
+
+  await PowerPoint.run(async (context) => {
+    const bindings = context.presentation.bindings;
+    bindings.load("items");
+    await context.sync();
+
+    const bindingCount = bindings.items.length;
+    if (bindingCount === 0) {
+      console.log(`There are no bindings.`);
+    } else if (bindingCount === 1) {
+      console.log("There's 1 binding.");
+    } else {
+      console.log(`There are ${bindingCount} bindings.`);
+    }
+
+    bindings.items.forEach((binding) => {
+      getShapeForBindingId(binding.id).then((shape) => {
+        if (shape) {
+          console.log(`Binding ID: ${binding.id} refers to shape ID ${shape.id}`);
+        } else {
+          console.log(`Binding ID: ${binding.id} doesn't refers to shape.`);
+        }
+      });
+    });
+
+    populateBindingsDropdown(bindings.items);
+  });
+
+  ```
+
 isPreview: false
 isDeprecated: false
 type: class
@@ -56,6 +97,49 @@ methods:
       1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
       \]
 
+
+      #### Examples
+
+
+      ```TypeScript
+
+      // Link to full sample:
+      https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+      // Inserts an image with binding.
+
+      await PowerPoint.run(async (context) => {
+        const bindingId = (document.getElementById("temp-binding-id") as HTMLInputElement).value;
+        const slide = context.presentation.getSelectedSlides().getItemAt(0);
+        const myShape = slide.shapes.addGeometricShape(PowerPoint.GeometricShapeType.rectangle, {
+          top: 100,
+          left: 30,
+          width: 200,
+          height: 200
+        });
+
+        myShape.fill.setImage(flowerImage);
+        context.presentation.bindings.add(myShape, PowerPoint.BindingType.shape, bindingId);
+        await context.sync();
+
+        const bindingsDropdown = document.getElementById("bindings-dropdown") as HTMLSelectElement;
+
+        const option = new Option(`Binding ${bindingId}`, bindingId);
+
+        // When a binding ID already exists, the binding is updated to refer to the new shape
+        // so select the existing item rather than add a new one.
+        const foundIndex = findDropdownItem(bindingsDropdown, option.text);
+        if (foundIndex < 0) {
+          bindingsDropdown.add(option);
+          bindingsDropdown.selectedIndex = bindingsDropdown.options.length - 1;
+        } else {
+          bindingsDropdown.selectedIndex = foundIndex;
+        }
+      });
+
+      ```
+
     isPreview: false
     isDeprecated: false
     syntax:
@@ -191,6 +275,28 @@ methods:
       1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
       \]
 
+
+      #### Examples
+
+
+      ```TypeScript
+
+      // Link to full sample:
+      https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+      async function getShapeForBindingId(bindingId: string):
+      Promise<PowerPoint.Shape | undefined> {
+        // Gets shape associated with binding ID.
+        return PowerPoint.run(async (context) => {
+          const binding = context.presentation.bindings.getItem(bindingId);
+          const shape = binding.getShape();
+          return shape;
+        });
+      }
+
+      ```
+
     isPreview: false
     isDeprecated: false
     syntax:

docs/docs-ref-autogen/powerpoint/powerpoint/powerpoint.bindingtype.yml

@@ -9,6 +9,49 @@ remarks: >-
   1.8](/javascript/api/requirement-sets/powerpoint/powerpoint-api-requirement-sets)
   \]
 
+
+  #### Examples
+
+
+  ```TypeScript
+
+  // Link to full sample:
+  https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/powerpoint/shapes/binding-to-shapes.yaml
+
+
+  // Inserts an image with binding.
+
+  await PowerPoint.run(async (context) => {
+    const bindingId = (document.getElementById("temp-binding-id") as HTMLInputElement).value;
+    const slide = context.presentation.getSelectedSlides().getItemAt(0);
+    const myShape = slide.shapes.addGeometricShape(PowerPoint.GeometricShapeType.rectangle, {
+      top: 100,
+      left: 30,
+      width: 200,
+      height: 200
+    });
+
+    myShape.fill.setImage(flowerImage);
+    context.presentation.bindings.add(myShape, PowerPoint.BindingType.shape, bindingId);
+    await context.sync();
+
+    const bindingsDropdown = document.getElementById("bindings-dropdown") as HTMLSelectElement;
+
+    const option = new Option(`Binding ${bindingId}`, bindingId);
+
+    // When a binding ID already exists, the binding is updated to refer to the new shape
+    // so select the existing item rather than add a new one.
+    const foundIndex = findDropdownItem(bindingsDropdown, option.text);
+    if (foundIndex < 0) {
+      bindingsDropdown.add(option);
+      bindingsDropdown.selectedIndex = bindingsDropdown.options.length - 1;
+    } else {
+      bindingsDropdown.selectedIndex = foundIndex;
+    }
+  });
+
+  ```
+
 isPreview: false
 isDeprecated: false
 fields: