├── README.md
├── icons
    ├── icon-16.png
    ├── icon-32.png
    ├── icon-64.png
    └── icon-80.png
├── manifest-officejs-hello.xml
├── screenshot.png
└── taskpane.html


/README.md:
--------------------------------------------------------------------------------
 1 | # The simplest Office.js add-in for Microsoft Excel
 2 | 
 3 | ![Screenshot](/screenshot.png?raw=true)
 4 | 
 5 | This is the simplest possible Office.js add-in for Microsoft Excel (task pane only). It only consists of two files (and an icon in a few sizes):
 6 | 
 7 | * `manifest-officejs-hello.xml`
 8 | * `taskpane.html`
 9 | 
10 | The HTML file is being served by [GitHub pages](https://docs.github.com/en/pages/quickstart). 
11 | 
12 | You can play around with the add-in by sideloading `manifest-officejs-hello.xml` according to the [office.js docs](https://learn.microsoft.com/en-us/office/dev/add-ins/testing/test-debug-office-add-ins#sideload-an-office-add-in-for-testing).
13 | 
14 | Note that this sample uses the raw Excel JavaScript API (no Python/xlwings).
15 | 


--------------------------------------------------------------------------------
/icons/icon-16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/xlwings/officejs-helloworld/8cf3a9adf843f70ee7895c3304772300fa8785f2/icons/icon-16.png


--------------------------------------------------------------------------------
/icons/icon-32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/xlwings/officejs-helloworld/8cf3a9adf843f70ee7895c3304772300fa8785f2/icons/icon-32.png


--------------------------------------------------------------------------------
/icons/icon-64.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/xlwings/officejs-helloworld/8cf3a9adf843f70ee7895c3304772300fa8785f2/icons/icon-64.png


--------------------------------------------------------------------------------
/icons/icon-80.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/xlwings/officejs-helloworld/8cf3a9adf843f70ee7895c3304772300fa8785f2/icons/icon-80.png


--------------------------------------------------------------------------------
/manifest-officejs-hello.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
 2 | <OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1"
 3 |   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 4 |   xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0"
 5 |   xmlns:ov="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="TaskPaneApp">
 6 |   <!-- If you create an app based off this repo, create an own ID e.g., via https://www.guidgen.com -->
 7 |   <Id>30d26041-7292-4d19-bd05-32c541f3c381</Id>
 8 |   <Version>1.0.0</Version>
 9 |   <ProviderName>Zoomer Analytics GmbH</ProviderName>
10 |   <DefaultLocale>en-US</DefaultLocale>
11 |   <DisplayName DefaultValue="Hello Office.js" />
12 |   <Description DefaultValue="A Hello Office.js App." />
13 |   <IconUrl DefaultValue="https://xlwings.github.io/officejs-helloworld/icons/icon-32.png" />
14 |   <HighResolutionIconUrl DefaultValue="https://xlwings.github.io/officejs-helloworld/icons/icon-64.png" />
15 |   <SupportUrl DefaultValue="https://www.xlwings.org/contact" />
16 |   <AppDomains>
17 |     <AppDomain>https://xlwings.github.io/officejs-helloworld/</AppDomain>
18 |   </AppDomains>
19 |   <Hosts>
20 |     <Host Name="Workbook" />
21 |   </Hosts>
22 |   <DefaultSettings>
23 |     <SourceLocation DefaultValue="https://xlwings.github.io/officejs-helloworld/taskpane.html" />
24 |   </DefaultSettings>
25 |   <Permissions>ReadWriteDocument</Permissions>
26 |   <VersionOverrides xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides" xsi:type="VersionOverridesV1_0">
27 |     <Hosts>
28 |       <Host xsi:type="Workbook">
29 |         <DesktopFormFactor>
30 |           <!-- resid must point to a Url Resource -->
31 |           <ExtensionPoint xsi:type="PrimaryCommandSurface">
32 | 
33 |             <CustomTab id="MyTab">
34 |               <Group id="MyCommandsGroup">
35 |                 <Label resid="MyCommandsGroup.Label" />
36 |                 <Icon>
37 |                   <bt:Image size="16" resid="Icon.16x16" />
38 |                   <bt:Image size="32" resid="Icon.32x32" />
39 |                   <bt:Image size="80" resid="Icon.80x80" />
40 |                 </Icon>
41 | 
42 |                 <!-- Ribbon button that opens the task pane -->
43 |                 <Control xsi:type="Button" id="MyTaskpaneButton">
44 |                   <Label resid="MyTaskpaneButton.Label" />
45 |                   <Supertip>
46 |                     <Title resid="MyTaskpaneButton.Label" />
47 |                     <Description resid="MyTaskpaneButton.Tooltip" />
48 |                   </Supertip>
49 |                   <Icon>
50 |                     <bt:Image size="16" resid="Icon.16x16" />
51 |                     <bt:Image size="32" resid="Icon.32x32" />
52 |                     <bt:Image size="80" resid="Icon.80x80" />
53 |                   </Icon>
54 |                   <!-- Action type must be ShowTaskpane -->
55 |                   <Action xsi:type="ShowTaskpane">
56 |                     <TaskpaneId>ButtonId1</TaskpaneId>
57 |                     <!-- resid must point to a Url Resource -->
58 |                     <SourceLocation resid="Taskpane.Url" />
59 |                   </Action>
60 |                 </Control>
61 | 
62 |               </Group>
63 |               <Label resid="MyTab.TabLabel" />
64 |             </CustomTab>
65 | 
66 |           </ExtensionPoint>
67 |         </DesktopFormFactor>
68 |       </Host>
69 |     </Hosts>
70 | 
71 |     <Resources>
72 |       <bt:Images>
73 |         <bt:Image id="Icon.16x16" DefaultValue="https://xlwings.github.io/officejs-helloworld/icons/icon-16.png" />
74 |         <bt:Image id="Icon.32x32" DefaultValue="https://xlwings.github.io/officejs-helloworld/icons/icon-32.png" />
75 |         <bt:Image id="Icon.80x80" DefaultValue="https://xlwings.github.io/officejs-helloworld/icons/icon-80.png" />
76 |       </bt:Images>
77 |       <bt:Urls>
78 |         <!-- This must point to the HTML document with the task pane -->
79 |         <bt:Url id="Taskpane.Url" DefaultValue="https://xlwings.github.io/officejs-helloworld/taskpane.html" />
80 |       </bt:Urls>
81 |       <bt:ShortStrings>
82 |         <bt:String id="MyTab.TabLabel" DefaultValue="Hello World" />
83 |         <bt:String id="MyCommandsGroup.Label" DefaultValue="MyGroup" />
84 |         <bt:String id="MyTaskpaneButton.Label" DefaultValue="Show Taskpane" />
85 |       </bt:ShortStrings>
86 |       <bt:LongStrings>
87 |         <bt:String id="MyTaskpaneButton.Tooltip" DefaultValue="Click to show the task pane" />
88 |       </bt:LongStrings>
89 |     </Resources>
90 | 
91 |   </VersionOverrides>
92 | </OfficeApp>
93 | 


--------------------------------------------------------------------------------
/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/xlwings/officejs-helloworld/8cf3a9adf843f70ee7895c3304772300fa8785f2/screenshot.png


--------------------------------------------------------------------------------
/taskpane.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 | 
 4 | <head>
 5 |     <meta charset="utf-8">
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
 7 |     <title>My Taskpane</title>
 8 |     <script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>
 9 | </head>
10 | 
11 | <body>
12 |     <!-- Put a button on the task pane -->
13 |     <p>Hit the Run button to paint the selected cells yellow and write the address to cell A1!</p>
14 |     <button id="run-btn" type="button">Run</button>
15 |     <script>
16 |         // Initialize Office.js
17 |         Office.onReady(function (info) { });
18 | 
19 |         // Add a click event listener to the button
20 |         document.getElementById("run-btn").addEventListener("click", run);
21 | 
22 |         // Based on 'Basic API call' sample from ScriptLab
23 |         async function run() {
24 |             await Excel.run(async (context) => {
25 |                 const range = context.workbook.getSelectedRange();
26 |                 range.format.fill.color = "yellow";
27 |                 range.load("address");
28 | 
29 |                 await context.sync();
30 | 
31 |                 const sheets = context.workbook.worksheets;
32 |                 sheets.getItem("Sheet1").getRange("A1").values = [["The selected address was " + range.address + "."]];
33 |             });
34 |         }
35 | 
36 |     </script>
37 | </body>
38 | 
39 | </html>
40 | 


--------------------------------------------------------------------------------