Criar comandos de suplemento com o manifesto unificado do Microsoft 365

  • Artigo

Os comandos de suplemento fornecem uma maneira fácil de personalizar a interface do usuário padrão do Office com elementos de interface do usuário especificados que executam ações. Para obter uma introdução aos comandos de suplemento, consulte Comandos de suplemento.

Este artigo descreve como configurar o manifesto unificado do Microsoft 365 (versão prévia) para definir comandos de suplemento e como criar o código para comandos de função.

Dica

As instruções para criar comandos de suplemento com o manifesto XML estão em Criar comandos de suplemento com o manifesto XML.

Observação

Atualmente, o manifesto unificado tem suporte apenas para suplementos do Outlook no Windows. Ele está em versão prévia e ainda não tem suporte para suplementos de produção.

Ponto de partida e etapas principais

Ambas as ferramentas que criam projetos de suplemento com um manifesto unificado – o gerador do Office Yeoman e o Teams Toolkit – criam projetos com um ou mais comandos de suplemento. A única vez que você ainda não terá um comando de suplemento é se estiver atualizando um suplemento que anteriormente não tinha um.

Duas decisões

  • Decida qual dos dois tipos de comandos de suplemento você precisa: painel de tarefas ou função.
  • Decida qual tipo de elemento de interface do usuário você precisa: botão ou item de menu. Em seguida, execute as etapas nas seções e subseções abaixo que correspondem às suas decisões.

Adicionar um comando de painel de tarefas

As subseções a seguir explicam como incluir um comando do painel de tarefas em um suplemento.

Configurar o runtime para o comando do painel de tarefas

  1. Abra o manifesto unificado e localize a matriz "extensions.runtimes".

  2. Verifique se há um objeto runtime que tem uma propriedade "actions.type" com o valor "openPage". Esse tipo de runtime abre um painel de tarefas.

  3. Verifique se a matriz "requirements.capabilities" contém um objeto que especifica um Conjunto de Requisitos que dá suporte a comandos de suplemento. Para o Outlook, o requisito mínimo definido para comandos de suplemento é a Caixa de Correio 1.3.

    Observação

    Quando o suporte para o manifesto unificado for estendido para outros aplicativos host do Office, o requisito mínimo definido para comandos de suplemento nesses outros hosts será AddinCommands 1.1.

  4. Verifique se a "id" do objeto runtime tem um nome descritivo, como "TaskPaneRuntime".

  5. Verifique se a propriedade "code.page" do objeto runtime está definida como a URL da página que deve ser aberta no painel de tarefas, como "https://localhost:3000/taskpane.html".

  6. Verifique se o objeto "actions.view" do runtime tem um nome que descreve o conteúdo da página definida na etapa anterior, como "homepage" ou "dashboard".

  7. Verifique se o "actions.id" do objeto runtime tem um nome descritivo como "ShowTaskPane" que indica o que acontece quando o usuário seleciona o botão de comando de suplemento ou item de menu.

  8. Defina as outras propriedades e subpropertidades do objeto runtime, conforme mostrado no exemplo concluído a seguir de um objeto runtime. As propriedades "tipo" e "lifetime" são necessárias e nos Suplementos do Outlook (que é o único host que atualmente dá suporte ao manifesto unificado) eles sempre têm os valores mostrados neste exemplo.

    "runtimes": [
    {
        "requirements": {
            "capabilities": [
                {
                    "name": "Mailbox",
                    "minVersion": "1.3"
                }
            ]
        },
        "id": "TaskPaneRuntime",
        "type": "general",
        "code": {
            "page": "https://localhost:3000/taskpane.html"
        },
        "lifetime": "short",
        "actions": [
            {
                "id": "ShowTaskPane",
                "type": "openPage",
                "view": "homepage"
            }
        ]
    }        
]

Configurar a interface do usuário para o comando do painel de tarefas

  1. Verifique se o objeto de extensão para o qual você configurou um runtime tem uma propriedade de matriz "ribbons" como um par para a matriz "runtimes". Normalmente, há apenas um objeto de extensão na matriz "extensões".

  2. Verifique se a matriz tem um objeto com propriedades de matriz chamadas "contextos" e "guias", conforme mostrado no exemplo a seguir.

    "ribbons": [
    {
        "contexts": [
            // child objects omitted
        ],
        "tabs": [
            // child objects omitted
        ]
    }
]

  3. Verifique se a matriz "contextos" tem cadeias de caracteres que especificam as janelas ou painéis nos quais a interface do usuário do comando do painel de tarefas deve ser exibida. Por exemplo, "mailRead" significa que ele aparecerá no painel de leitura ou na janela da mensagem quando uma mensagem de email estiver aberta, mas "mailCompose" significa que ela será exibida quando uma nova mensagem ou uma resposta estiver sendo composta. A seguir estão os valores permitidos:

    • "mailRead"
    • "mailCompose"
    • "meetingDetailsOrganizer"
    • "meetingDetailsAttendee"

    Apresentamos um exemplo a seguir.

    "contexts": [
    "mailRead"
],

  4. Verifique se a matriz "tabs" tem um objeto com uma propriedade de cadeia de caracteres "builtInTabId" definida como a guia ID da faixa de opções na qual você deseja que o comando do painel de tarefas apareça. Além disso, verifique se há uma matriz de "grupos" com pelo menos um objeto nele. Apresentamos um exemplo a seguir.

    "tabs": [
    {
        "builtInTabID": "TabDefault",
        "groups": [
            {
                // properties omitted                
            }
        ]
    }
]

    Observação

    O único valor permitido para a propriedade "builtInTabID" é "TabDefault", que no Outlook é a guia Casa, Mensagem ou Reunião . Quando o suporte para o manifesto unificado for adicionado a outros aplicativos host do Office, haverá outros valores possíveis.

  5. Verifique se a matriz "grupos" tem um objeto para definir o grupo de controle personalizado que manterá seus controles de interface do usuário de comando de suplemento. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • A "id" deve ser exclusiva em todos os grupos em todos os objetos de faixa de opções no manifesto. O comprimento máximo é de 64 caracteres.
    • O "rótulo" aparece no grupo na faixa de opções. O comprimento máximo é de 64 caracteres.
    • Um dos "ícones" será exibido no grupo somente se a janela do aplicativo do Office e, portanto, a faixa de opções tiver sido dimensionada pelo usuário muito pequena para que qualquer um dos controles do grupo apareça. O Office decide quando usar um desses ícones e qual usar com base no tamanho da janela e na resolução do dispositivo. Você não pode controlar isso. Você deve fornecer arquivos de imagem para 16, 32 e 80 pixels, enquanto outros cinco tamanhos também têm suporte (20, 24, 40, 48 e 64 pixels). Você deve usar a SSL (Secure Sockets Layer) para todas as URLs.
    "groups": [
    {
        "id": "msgReadGroup",
        "label": "Contoso Add-in",
        "icons": [
            {
                "size": 16,
                "url": "https://localhost:3000/assets/icon-16.png"
            },
            {
                "size": 32,
                "url": "https://localhost:3000/assets/icon-32.png"
            },
            {
                "size": 80,
                "url": "https://localhost:3000/assets/icon-80.png"
            }
        ],
        "controls": [
            {
                // properties omitted 
            }
        ]
    }
]

  6. Verifique se há um objeto de controle na matriz "controles" para cada botão ou menu personalizado desejado. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • As propriedades "id", "label" e "icons" têm a mesma finalidade e as mesmas restrições que as propriedades correspondentes de um objeto de grupo, exceto que elas se aplicam a um botão ou menu específico dentro do grupo.
    • A propriedade "tipo" é definida como "botão", o que significa que o controle será um botão de faixa de opções. Você também pode configurar um comando de painel de tarefas a ser executado a partir de um item de menu. Consulte Menu e itens de menu.
    • Os "supertip.title" (comprimento máximo: 64 caracteres) e "supertip.description" (comprimento máximo: 128 caracteres) aparecem quando o cursor está pairando sobre o botão ou menu.
    • O "actionId" deve ser uma correspondência exata para o "runtimes.actions.id" que você definiu em Configurar o runtime para o comando do painel de tarefas.
    {
    "id": "msgReadOpenPaneButton",
    "type": "button",
    "label": "Show Task Pane",
    "icons": [
        {
            "size": 16,
            "url": "https://localhost:3000/assets/icon-16.png"
        },
        {
            "size": 32,
            "url": "https://localhost:3000/assets/icon-32.png"
        },
        {
            "size": 80,
            "url": "https://localhost:3000/assets/icon-80.png"
        }
    ],
    "supertip": {
        "title": "Show Contoso Task Pane",
        "description": "Opens the Contoso task pane."
    },
    "actionId": "ShowTaskPane"
}

Agora você concluiu a adição de um comando de painel de tarefas ao seu suplemento. Carregar o lado e testá-lo.

Adicionar um comando de função

As subseções a seguir explicam como incluir um comando de função em um suplemento.

Criar o código para o comando de função

  1. Verifique se o código-fonte inclui um arquivo JavaScript ou Typescript com a função que você deseja executar com o comando da função. Apresentamos um exemplo a seguir. Como este artigo trata da criação de comandos de suplemento e não de ensinar a Biblioteca JavaScript do Office, fornecemos comentários mínimos, mas observamos o seguinte:

    • Para fins deste artigo, o arquivo é nomeado commands.js.
    • A função fará com que uma pequena notificação apareça em uma mensagem de email aberta com o texto "Ação executada".
    • Como todo código que chama APIs na Biblioteca JavaScript do Office, ele deve começar inicializando a biblioteca. Ele faz isso chamando Office.onReady.
    • A última coisa que o código chama é Office.actions.associate para informar ao Office qual função no arquivo deve ser executada quando a interface do usuário do comando de função for invocada. A função mapeia o nome da função para uma ID de ação que você configura no manifesto em uma etapa posterior. Se você definir vários comandos de função no mesmo arquivo, seu código deverá chamar associate para cada um deles.
    • A função deve usar um parâmetro do tipo Office.AddinCommands.Event. A última linha da função deve chamar event.completed.
    Office.onReady(function() {
// Add any initialization code here.
});

function setNotification(event) {
const message = {
    type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,
    message: "Performed action.",
    icon: "Icon.80x80",
    persistent: true,
};

// Show a notification message.
Office.context.mailbox.item.notificationMessages.replaceAsync("ActionPerformanceNotification", message);

// Be sure to indicate when the add-in command function is complete.
event.completed();
}

// Map the function to the action ID in the manifest.
Office.actions.associate("SetNotification", setNotification);

  2. Verifique se o código-fonte inclui um arquivo HTML configurado para carregar o arquivo de função que você criou. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • Para fins deste artigo, o arquivo é nomeado commands.html.

    • O <body> elemento está vazio porque o arquivo não tem interface do usuário. Sua única finalidade é carregar arquivos JavaScript.

    • A Biblioteca JavaScript do Office e o arquivo commands.js que você criou na etapa anterior são carregados explicitamente.

      Observação

      É comum no desenvolvimento do Suplemento do Office usar ferramentas como webpack e seus plug-ins para injetar <script> automaticamente marcas em arquivos HTML no momento do build. Se você usar essa ferramenta, não deverá incluir nenhuma <script> marca no arquivo de origem que será inserida pela ferramenta.

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

        <!-- Office JavaScript Library -->
        <script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
        <!-- Function command file -->
        <script src="commands.js" type="text/javascript"></script>
    </head>
    <body>        
    </body>
</html>

Configurar o runtime para o comando de função

  1. Abra o manifesto unificado e localize a matriz "extensions.runtimes".

  2. Verifique se há um objeto runtime que tem uma propriedade "actions.type" com o valor "executeFunction".

  3. Verifique se a matriz "requirements.capabilities" contém objetos que especificam todos os Conjuntos de Requisitos necessários para dar suporte aos comandos de suplemento de APIs. Para o Outlook, o requisito mínimo definido para comandos de suplemento é a Caixa de Correio 1.3. Mas se o comando de função chamar essa API que faz parte do conjunto de requisitos da Caixa de Correio posterior, como a Caixa de Correio 1.5, você precisará especificar a versão posterior (por exemplo, "1.5") como o valor "minVersion".

    Observação

    Quando o suporte para o manifesto unificado for estendido para outros aplicativos host do Office, o requisito mínimo definido para comandos de suplemento nesses outros hosts será AddinCommands 1.1.

  4. Verifique se a "id" do objeto runtime tem um nome descritivo, como "CommandsRuntime".

  5. Verifique se a propriedade "code.page" do objeto runtime está definida como a URL da página HTML sem interface do usuário que carrega seu arquivo de função, como "https://localhost:3000/commands.html".

  6. Verifique se o "actions.id" do objeto runtime tem um nome descritivo como "SetNotification" que indica o que acontece quando o usuário seleciona o botão de comando de suplemento ou item de menu.

    Importante

    O valor de "actions.id" deve corresponder exatamente ao primeiro parâmetro da chamada no Office.actions.associate arquivo de função.

  7. Defina as outras propriedades e subpropertidades do objeto runtime, conforme mostrado no exemplo concluído a seguir de um objeto runtime. As propriedades "tipo" e "lifetime" são necessárias e sempre têm os valores mostrados nos suplementos do Outlook, que é o único host que atualmente dá suporte ao manifesto unificado.

    "runtimes": [
    {
        "id": "CommandsRuntime",
        "type": "general",
        "code": {
            "page": "https://localhost:3000/commands.html"
        },
        "lifetime": "short",
        "actions": [
            {
                "id": "SetNotification",
                "type": "executeFunction",
            }
        ]
    }       
]

Configurar a interface do usuário para o comando de função

  1. Verifique se o objeto de extensão para o qual você configurou um runtime tem uma propriedade de matriz "ribbons" como um par para a matriz "runtimes". Normalmente, há apenas um objeto de extensão na matriz "extensões".

  2. Verifique se a matriz tem um objeto com propriedades de matriz chamadas "contextos" e "guias", conforme mostrado no exemplo a seguir.

    "ribbons": [
    {
        "contexts": [
            // child objects omitted
        ],
        "tabs": [
            // child objects omitted
        ]
    }
]

  3. Verifique se a matriz "contextos" tem cadeias de caracteres que especificam as janelas ou painéis nos quais a interface do usuário do comando de função deve ser exibida. Por exemplo, "mailRead" significa que ele aparecerá no painel de leitura ou na janela da mensagem quando uma mensagem de email estiver aberta, mas "mailCompose" significa que ela será exibida quando uma nova mensagem ou uma resposta estiver sendo composta. A seguir estão os valores permitidos:

    • mailRead
    • mailCompose
    • meetingDetailsOrganizer
    • meetingDetailsAttendee

    Apresentamos um exemplo a seguir.

    "contexts": [
    "mailRead"
],

  4. Verifique se a matriz "tabs" tem um objeto com uma propriedade de cadeia de caracteres "builtInTabId" definida como a guia ID da faixa de opções na qual você deseja que seu comando de função apareça e uma matriz "grupos" com pelo menos um objeto. Apresentamos um exemplo a seguir.

    "tabs": [
    {
        "builtInTabID": "TabDefault",
        "groups": [
            {
                // properties omitted                
            }
        ]
    }
]

    Observação

    O único valor permitido para a propriedade "builtInTabID" é "TabDefault", que no Outlook é a guia Casa, Mensagem ou Reunião . Quando o suporte para o manifesto unificado for adicionado a outros aplicativos host do Office, haverá outros valores possíveis.

  5. Verifique se a matriz "grupos" tem um objeto para definir o grupo de controle personalizado que manterá seus controles de interface do usuário de comando de suplemento. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • A "id" deve ser exclusiva em todos os grupos em todos os objetos de faixa de opções no manifesto. O comprimento máximo é de 64 caracteres.
    • O "rótulo" aparece no grupo na faixa de opções. O comprimento máximo é de 64 caracteres.
    • Um dos "ícones" será exibido no grupo somente se a janela do aplicativo do Office e, portanto, a faixa de opções tiver sido dimensionada pelo usuário muito pequena para que qualquer um dos controles do grupo apareça. O Office decide quando usar um desses ícones e qual usar com base no tamanho da janela e na resolução do dispositivo. Você não pode controlar isso. Você deve fornecer arquivos de imagem para 16, 32 e 80 pixels, enquanto outros cinco tamanhos também têm suporte (20, 24, 40, 48 e 64 pixels). Você deve usar a SSL (Secure Sockets Layer) para todas as URLs.
    "groups": [
    {
        "id": "msgReadGroup",
        "label": "Contoso Add-in",
        "icons": [
            {
                "size": 16,
                "url": "https://localhost:3000/assets/icon-16.png"
            },
            {
                "size": 32,
                "url": "https://localhost:3000/assets/icon-32.png"
            },
            {
                "size": 80,
                "url": "https://localhost:3000/assets/icon-80.png"
            }
        ],
        "controls": [
            {
                // properties omitted 
            }
        ]
    }
]

  6. Verifique se há um objeto de controle na matriz "controles" para cada botão ou menu personalizado desejado. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • As propriedades "id", "label" e "icons" têm a mesma finalidade e as mesmas restrições que as propriedades correspondentes de um objeto de grupo, exceto que elas se aplicam a um botão ou menu específico dentro do grupo.
    • A propriedade "tipo" é definida como "botão", o que significa que o controle será um botão de faixa de opções. Você também pode configurar um comando de função a ser executado a partir de um item de menu. Consulte Menu e itens de menu.
    • Os "supertip.title" (comprimento máximo: 64 caracteres) e "supertip.description" (comprimento máximo: 128 caracteres) aparecem quando o cursor está pairando sobre o botão ou menu.
    • O "actionId" deve ser uma correspondência exata para o "runtime.actions.id" que você definiu em Configurar o runtime para o comando da função.
    {
    "id": "msgReadSetNotificationButton",
    "type": "button",
    "label": "Set Notification",
    "icons": [
        {
            "size": 16,
            "url": "https://localhost:3000/assets/icon-16.png"
        },
        {
            "size": 32,
            "url": "https://localhost:3000/assets/icon-32.png"
        },
        {
            "size": 80,
            "url": "https://localhost:3000/assets/icon-80.png"
        }
    ],
    "supertip": {
        "title": "Set Notification",
        "description": "Displays a notification message on the current message."
    },
    "actionId": "SetNotification"
}

Agora você concluiu a adição de um comando de função ao seu suplemento. Carregar o lado e testá-lo.

Além dos botões personalizados, você também pode adicionar menus suspensos personalizados à faixa de opções do Office. Esta seção explica como usar um exemplo com dois itens de menu. Um invoca um comando de painel de tarefas. O outro invoca um comando de função.

Configurar os runtimes e o código

Execute as etapas das seguintes seções:

Configurar a interface do usuário para o menu

  1. Verifique se o objeto de extensão para o qual você configurou um runtime tem uma propriedade de matriz "ribbons" como um par para a matriz "runtimes". Normalmente, há apenas um objeto de extensão na matriz "extensões".

  2. Verifique se a matriz tem um objeto com propriedades de matriz chamadas "contextos" e "guias", conforme mostrado no exemplo a seguir.

    "ribbons": [
    {
        "contexts": [
            // child objects omitted
        ],
        "tabs": [
            // child objects omitted
        ]
    }
]

  3. Verifique se a matriz "contextos" tem cadeias de caracteres que especificam as janelas ou painéis em que o menu deve aparecer na faixa de opções. Por exemplo, "mailRead" significa que ele aparecerá no painel de leitura ou na janela da mensagem quando uma mensagem de email estiver aberta, mas "mailCompose" significa que ela será exibida quando uma nova mensagem ou uma resposta estiver sendo composta. A seguir estão os valores permitidos:

    • mailRead
    • mailCompose
    • meetingDetailsOrganizer
    • meetingDetailsAttendee

    Apresentamos um exemplo a seguir.

    "contexts": [
    "mailRead"
],

  4. Verifique se a matriz "tabs" tem um objeto com uma propriedade de cadeia de caracteres "builtInTabId" definida como a guia ID da faixa de opções na qual você deseja que o comando do painel de tarefas apareça e uma matriz "grupos" com pelo menos um objeto. Apresentamos um exemplo a seguir.

    "tabs": [
    {
        "builtInTabID": "TabDefault",
        "groups": [
            {
                // properties omitted                
            }
        ]
    }
]

    Observação

    O único valor permitido para a propriedade "builtInTabID" é "TabDefault", que no Outlook é a guia Casa, Mensagem ou Reunião . Quando o suporte para o manifesto unificado for adicionado a outros aplicativos host do Office, haverá outros valores possíveis.

  5. Verifique se a matriz "grupos" tem um objeto para definir o grupo de controle personalizado que manterá o controle de menu suspenso. Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • A "id" deve ser exclusiva em todos os grupos em todos os objetos de faixa de opções no manifesto. O comprimento máximo é de 64 caracteres.
    • O "rótulo" aparece no grupo na faixa de opções. O comprimento máximo é de 64 caracteres.
    • Um dos "ícones" será exibido no grupo somente se a janela do aplicativo do Office e, portanto, a faixa de opções tiver sido dimensionada pelo usuário muito pequena para que qualquer um dos controles do grupo apareça. O Office decide quando usar um desses ícones e qual usar com base no tamanho da janela e na resolução do dispositivo. Você não pode controlar isso. Você deve fornecer arquivos de imagem para 16, 32 e 80 pixels, enquanto outros cinco tamanhos também têm suporte (20, 24, 40, 48 e 64 pixels). Você deve usar a SSL (Secure Sockets Layer) para todas as URLs.
    "groups": [
    {
        "id": "msgReadGroup",
        "label": "Contoso Add-in",
        "icons": [
            {
                "size": 16,
                "url": "https://localhost:3000/assets/icon-16.png"
            },
            {
                "size": 32,
                "url": "https://localhost:3000/assets/icon-32.png"
            },
            {
                "size": 80,
                "url": "https://localhost:3000/assets/icon-80.png"
            }
        ],
        "controls": [
            {
                // properties omitted 
            }
        ]
    }
]

  6. Verifique se há um objeto de controle na matriz "controles". Apresentamos um exemplo a seguir. Observe o seguinte sobre este JSON:

    • As propriedades "id", "label" e "icons" têm a mesma finalidade e as mesmas restrições que as propriedades correspondentes de um objeto de grupo, exceto que elas se aplicam ao menu suspenso dentro do grupo.
    • A propriedade "tipo" é definida como "menu", o que significa que o controle será um menu suspenso.
    • Os "supertip.title" (comprimento máximo: 64 caracteres) e "supertip.description" (comprimento máximo: 128 caracteres) aparecem quando o cursor está pairando sobre o menu.
    • A propriedade "itens" contém o JSON para as duas opções de menu. Os valores são adicionados em etapas posteriores.
    {
    "id": "msgReadMenu",
    "type": "menu",
    "label": "Contoso Menu",
    "icons": [
        {
            "size": 16,
            "url": "https://localhost:3000/assets/icon-16.png"
        },
        {
            "size": 32,
            "url": "https://localhost:3000/assets/icon-32.png"
        },
        {
            "size": 80,
            "url": "https://localhost:3000/assets/icon-80.png"
        }
    ],
    "supertip": {
        "title": "Show Contoso Actions",
        "description": "Opens the Contoso menu."
    },
    "items": [
        {
            "id": "",
            "type": "",
            "label": "",
            "supertip": {},
            "actionId": ""
        },
        {
            "id": "",
            "type": "",
            "label": "",
            "supertip": {},
            "actionId": ""
        }
    ]
}

  7. O primeiro item mostra um painel de tarefas. Apresentamos um exemplo a seguir. Observe o seguinte sobre este código:

    • As propriedades "id", "label" e "supertip" têm a mesma finalidade e as mesmas restrições que as propriedades correspondentes do objeto de menu pai, exceto que elas se aplicam apenas a essa opção de menu.
    • A propriedade "ícones" é opcional para itens de menu e não há um neste exemplo. Se você incluir um, ele terá as mesmas finalidades e restrições que a propriedade "ícones" do menu pai, exceto que o ícone será exibido no item de menu ao lado do rótulo.
    • A propriedade "type" é definida como "menuItem".
    • O "actionId" deve ser uma correspondência exata para o "runtimes.actions.id" que você definiu em Configurar o runtime para o comando do painel de tarefas.
    {
    "id": "msgReadOpenPaneMenuItem",
    "type": "menuItem",
    "label": "Show Task Pane",
    "supertip": {
        "title": "Show Contoso Task Pane",
        "description": "Opens the Contoso task pane."
    },
    "actionId": "ShowTaskPane"
},

  8. O segundo item executa um comando de função. Apresentamos um exemplo a seguir. Observe o seguinte sobre este código:

    {
    "id": "msgReadSetNotificationMenuItem",
    "type": "menuItem",
    "label": "Set Notification",
    "supertip": {
        "title": "Set Notification",
        "description": "Displays a notification message on the current message."
    },
    "actionId": "SetNotification"
}

Agora você concluiu a adição de um menu ao seu suplemento. Carregar o lado e testá-lo.

Confira também