LoadTaskCard from a Gist

LoadTaskCard.EXCEL.yaml

name: LoadTaskCard
description: LoadTaskCard from a Gist
host: EXCEL
api_set: {}
script:
  content: |
    fetch(
      "https://gist.githubusercontent.com/MikeAinOz/b1bb2884a6d39ea033b080f9d4e60d4c/raw/90ff6cd937e078ed334a6bcb69e54c068793bf0c/TaskCard.json"
    )
      .then((response) => response.json())
      .then((data) => 
      { var templatePayload = data.json;
        var template = new ACData.Template(templatePayload);
        // Expand the template with your `$root` data object.
        // This binds it to the data and produces the final Adaptive Card payload
        var cardPayload = template.expand({
          $root: {
            Task: "The Task name will Be here",
            TaskDescription: "This will be the description"
          }
        });
        var adaptiveCard = new AdaptiveCards.AdaptiveCard();
        adaptiveCard.parse(cardPayload);
        document.getElementById("ThisCard").appendChild(adaptiveCard.render());
      });

    let runbutton = document.getElementById("run");
    runbutton.onclick = () => tryCatch(run);

    async function run() {
      await Excel.run(async (context) => {
        const range = context.workbook.getSelectedRange();
        const tbl = context.workbook;
        tbl.load("tables");
        await context.sync();
        console.log(tbl.tables[0]);
        // range.format.fill.color = null;
        range.load("address,values");

        await context.sync();
        console.log(JSON.stringify(range.values));
        console.log(`The range address was "${range.address}".`);
      });
    }

    /** Default helper for invoking an action and handling errors. */
    async function tryCatch(callback) {
      try {
        await callback();
      } catch (error) {
        // Note: In a production add-in, you'd want to notify the user through your add-in's UI.
        console.error(error);
      }
    }
  language: typescript
template:
  content: |-
    <div id="ThisCard">This is a card</div>
    <button id="run" class="ms-Button">
            <span class="ms-Button-label">Run</span>
        </button>
  language: html
style:
  content: |-
    section.samples {
        margin-top: 20px;
    }

    section.samples .ms-Button, section.setup .ms-Button {
        display: block;
        margin-bottom: 5px;
        margin-left: 20px;
        min-width: 80px;
    }
  language: css
libraries: |
  https://appsforoffice.microsoft.com/lib/1/hosted/office.js
  @types/office-js

  [email protected]/dist/css/fabric.min.css
  [email protected]/dist/css/fabric.components.min.css

  [email protected]/client/core.min.js
  @types/core-js

  adaptivecards/dist/adaptivecards.min.js
  adaptivecards-templating/dist/adaptivecards-templating.min.js