ooxml-ui 1.7.0 → 1.8.0

package/dist/chrome/task-pane.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"task-pane.d.ts","sourceRoot":"","sources":["../../src/chrome/task-pane.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAiB,MAAM,SAAS,CAAC;AAKvD;;;;;GAKG;AACH,qBAAa,gBAAiB,SAAQ,aAAa;IAClD,MAAM,CAAC,UAAU,SAAuB;IACxC,OAAgB,MAAM,4BAAsB;IAC5C,OAAgB,UAAU;QACzB,KAAK;YAAI,IAAI;;QACb,UAAU;YAAI,IAAI;YAAU,SAAS;;MACpC;IACM,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IAE3B,cAIC;IAED,UAAmB,UAAU,IAAI,IAAI,CAGpC;IAED,UAAmB,MAAM,oCAaxB;CACD;AAED,eAAO,MAAM,cAAc,+BAAyD,CAAC"}
+{"version":3,"file":"task-pane.d.ts","sourceRoot":"","sources":["../../src/chrome/task-pane.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAiB,MAAM,SAAS,CAAC;AAKvD;;;;;;;GAOG;AACH,qBAAa,gBAAiB,SAAQ,aAAa;IAClD,MAAM,CAAC,UAAU,SAAuB;IACxC,OAAgB,MAAM,4BAAsB;IAC5C,OAAgB,UAAU;QACzB,KAAK;YAAI,IAAI;;QACb,UAAU;YAAI,IAAI;YAAU,SAAS;;MACpC;IACM,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IAE3B,cAIC;IAED,UAAmB,UAAU,IAAI,IAAI,CAGpC;IAED,UAAmB,MAAM,oCAaxB;CACD;AAED,eAAO,MAAM,cAAc,+BAAyD,CAAC"}

package/dist/chrome/title-bar.d.ts

@@ -6,7 +6,8 @@ export * from './title-bar-types.js';
  * `<office-ui-title-bar>`: Office's title bar above the ribbon (app mark, AutoSave, Quick
  * Access Toolbar, file name and status, centred command search, `actions`, `collaboration` and
  * `account` slots). Controlled: set `state` (`OfficeTitleBarState`, every string translated); the bar
- * owns no effects. `placement="belowRibbon"` renders only the Quick Access row and hides
+ * owns no effects. The `centered` attribute puts the file name in the middle of the bar.
+ * `placement="belowRibbon"` renders only the Quick Access row and hides
  * itself (`data-empty`) while that row is empty. Events (bubbling, composed; static names let a
  * product subclass keep its published ones): `office-autosave-toggle`, `office-command`
  * `{ command }` from a Quick Access button and `office-command-search` `{ query, command? }`.

package/dist/chrome/title-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"title-bar.d.ts","sourceRoot":"","sources":["../../src/chrome/title-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIrE,OAAO,EAAE,aAAa,EAAiB,MAAM,SAAS,CAAC;AAKvD,OAAO,EAIN,KAAK,qBAAqB,EAC1B,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACxB,MAAM,mBAAmB,CAAC;AAG3B,cAAc,mBAAmB,CAAC;AAYlC;;;;;;;;;;;GAWG;AACH,qBAAa,gBAAiB,SAAQ,aAAa;IAClD,MAAM,CAAC,aAAa,SAA4B;IAChD,MAAM,CAAC,YAAY,SAAoB;IACvC,MAAM,CAAC,WAAW,SAA2B;IAC7C,uEAAuE;IACvE,MAAM,CAAC,SAAS,SAAsB;IACtC,MAAM,CAAC,SAAS,SAAsB;IACtC,OAAgB,MAAM,4BAAsB;IAC5C,OAAgB,UAAU;QACzB,SAAS;YAAI,IAAI;YAAU,UAAU;;QACrC,IAAI;YAAI,KAAK;;QACb,KAAK;YAAI,KAAK;;QACd,MAAM;YAAI,KAAK;;QACf,WAAW;YAAI,KAAK;;QACpB,IAAI;YAAI,KAAK;;MACZ;IACM,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,KAAK,CAA8B;IAE3C,cAOC;IAED,IAAI,KAAK,IAAI,mBAAmB,CAE/B;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,mBAAmB,GAAG,IAAI,GAAG,SAAS,EAGtD;IAED,8FAA8F;IAC9F,IAAI,SAAS,IAAI,uBAAuB,CAEvC;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,uBAAuB,EAG3C;IAED,gFAAgF;IAChF,IAAI,WAAW,IAAI,WAAW,CAI7B;IAED,qEAAqE;IACrE,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAEzB;IAED,6EAA6E;IAC7E,QAAQ,IAAI,IAAI,CAAG;IAInB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,UAAU;IAKlB,OAAO,CAAC,QAAQ;IAoBhB,OAAO,CAAC,WAAW;IAkCnB,OAAO,KAAK,KAAK,GAEhB;IAED,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,MAAM;IAUd,OAAO,CAAC,WAAW;IAgBnB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,OAAO;IA+Cf,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,QAAQ;IAwBhB,UAAmB,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI,CAKjE;IAED,UAAmB,OAAO,IAAI,IAAI,CAEjC;IAED,UAAmB,MAAM,sBA+BxB;CACD;AAED,eAAO,MAAM,cAAc,+BAGzB,CAAC"}
+{"version":3,"file":"title-bar.d.ts","sourceRoot":"","sources":["../../src/chrome/title-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIrE,OAAO,EAAE,aAAa,EAAiB,MAAM,SAAS,CAAC;AAKvD,OAAO,EAIN,KAAK,qBAAqB,EAC1B,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACxB,MAAM,mBAAmB,CAAC;AAG3B,cAAc,mBAAmB,CAAC;AAYlC;;;;;;;;;;;;GAYG;AACH,qBAAa,gBAAiB,SAAQ,aAAa;IAClD,MAAM,CAAC,aAAa,SAA4B;IAChD,MAAM,CAAC,YAAY,SAAoB;IACvC,MAAM,CAAC,WAAW,SAA2B;IAC7C,uEAAuE;IACvE,MAAM,CAAC,SAAS,SAAsB;IACtC,MAAM,CAAC,SAAS,SAAsB;IACtC,OAAgB,MAAM,4BAAsB;IAC5C,OAAgB,UAAU;QACzB,SAAS;YAAI,IAAI;YAAU,UAAU;;QACrC,IAAI;YAAI,KAAK;;QACb,KAAK;YAAI,KAAK;;QACd,MAAM;YAAI,KAAK;;QACf,WAAW;YAAI,KAAK;;QACpB,IAAI;YAAI,KAAK;;MACZ;IACM,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,KAAK,CAA8B;IAE3C,cAOC;IAED,IAAI,KAAK,IAAI,mBAAmB,CAE/B;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,mBAAmB,GAAG,IAAI,GAAG,SAAS,EAGtD;IAED,8FAA8F;IAC9F,IAAI,SAAS,IAAI,uBAAuB,CAEvC;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,uBAAuB,EAG3C;IAED,gFAAgF;IAChF,IAAI,WAAW,IAAI,WAAW,CAI7B;IAED,qEAAqE;IACrE,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAEzB;IAED,6EAA6E;IAC7E,QAAQ,IAAI,IAAI,CAAG;IAInB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,UAAU;IAKlB,OAAO,CAAC,QAAQ;IAoBhB,OAAO,CAAC,WAAW;IAkCnB,OAAO,KAAK,KAAK,GAEhB;IAED,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,MAAM;IAUd,OAAO,CAAC,WAAW;IAgBnB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,OAAO;IA+Cf,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,QAAQ;IAwBhB,UAAmB,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI,CAKjE;IAED,UAAmB,OAAO,IAAI,IAAI,CAEjC;IAED,UAAmB,MAAM,sBA+BxB;CACD;AAED,eAAO,MAAM,cAAc,+BAGzB,CAAC"}

package/dist/{chunk-6UPGM3X2.js → chunk-7US5GCXF.js}

@@ -1,5 +1,5 @@
 import { THEME_CSS, installOfficeUiTheme } from './chunk-BCH2ZLWI.js';
-import { defineMenuButton, defineMenuItem, registerControls, defineSwitch } from './chunk-SCWCZSTE.js';
+import { defineMenuButton, defineMenuItem, registerControls, defineSwitch } from './chunk-O7APCA5N.js';
 import { registerIcon, getIcon } from './chunk-M6GF5ED2.js';
 import { initialsOf, definePresence } from './chunk-L7JV5FVE.js';
 import { definer, OfficeElement, controlStyles } from './chunk-OGNNNTKI.js';
@@ -590,18 +590,18 @@ var OfficeUiChatComposer = class extends TeamsElement {
 				${this.files.length ? html`<ul class="pending">
 								${this.files.map(
       (f, i) => html`<li>
-										<button
-											type="button"
-											aria-label=${`Remove ${f.name}`}
-											@click=${() => {
+											<button
+												type="button"
+												aria-label=${`Remove ${f.name}`}
+												@click=${() => {
         this.files = this.files.filter((_, j) => j !== i);
         this.focusMessage();
         this.saveDraft();
       }}
-										>
-											<span class="file-label" title=${f.name}>${f.name}</span>${icon("close")}
-										</button>
-									</li>`
+											>
+												<span class="file-label" title=${f.name}>${f.name}</span>${icon("close")}
+											</button>
+										</li>`
     )}
 							</ul>` : nothing}
 				<div class="bar">
@@ -628,9 +628,9 @@ var OfficeUiChatComposer = class extends TeamsElement {
 						${this.emojiOpen ? html`<div class="picker" role="menu">
 										${EMOJI.map(
       (e) => html`<button
-												type="button"
-												role="menuitem"
-												@click=${() => {
+													type="button"
+													role="menuitem"
+													@click=${() => {
         const area = this.renderRoot.querySelector("textarea");
         const start = area?.selectionStart ?? this.value.length, end = area?.selectionEnd ?? start;
         this.value = this.value.slice(0, start) + e + this.value.slice(end);
@@ -642,9 +642,9 @@ var OfficeUiChatComposer = class extends TeamsElement {
         this.emojiOpen = false;
         this.renderRoot.querySelector("textarea")?.focus();
       }}
-											>
-												${e}
-											</button>`
+												>
+													${e}
+												</button>`
     )}
 									</div>` : nothing}
 					</div>
@@ -773,12 +773,12 @@ var OfficeUiChatList = class extends TeamsElement {
 			<div class="toolbar" role="toolbar" aria-label="Message actions">
 				${QUICK_REACTIONS.slice(0, 4).map(
       (emoji) => html`<button
-						type="button"
-						aria-label=${`React ${emoji}`}
-						@click=${() => this.fire("office-chat-react", { messageId: m.id, emoji })}
-					>
-						${emoji}
-					</button>`
+							type="button"
+							aria-label=${`React ${emoji}`}
+							@click=${() => this.fire("office-chat-react", { messageId: m.id, emoji })}
+						>
+							${emoji}
+						</button>`
     )}
 				<button
 					type="button"
@@ -967,7 +967,8 @@ var XLSX_EDITOR_EVENTS = [
   "selection-change",
   "sheet-change",
   "dirty-change",
-  "collaboration-change"
+  "collaboration-change",
+  "office-ribbon-add-in"
 ];
 var CANCELABLE = /* @__PURE__ */ new Set(["file-command"]);
 function emitEvent(target, type, detail) {
@@ -1883,35 +1884,35 @@ var TeamsFilesPanel = class extends LitElement {
 					<tbody>
 						${files.length ? files.map(
       (file) => html`<tr>
-											<td>
-												<div class="file-name">
-													<span class="badge" data-kind=${file.kind}
-														>${{ docx: "W", xlsx: "X", pptx: "P", vsdx: "V", other: "F" }[file.kind]}</span
-													>
-													<button
-														class="file-open"
-														type="button"
-														aria-label=${`Open ${file.name}`}
-														title=${file.name}
-														?disabled=${!file.url}
-														@click=${() => this.emit("open", file)}
-													>
-														${file.name}
-													</button>
-												</div>
-											</td>
-											<td><time>${new Date(file.ts).toLocaleDateString()}</time></td>
-											<td>${file.author}</td>
-											<td>
-												${file.channelName ? `# ${file.channelName}` : `# ${this.channelName}`}
-											</td>
-											<td>
-												<teams-file-actions
-													.file=${file}
-													.client=${this.client}
-												></teams-file-actions>
-											</td>
-										</tr>`
+												<td>
+													<div class="file-name">
+														<span class="badge" data-kind=${file.kind}
+															>${{ docx: "W", xlsx: "X", pptx: "P", vsdx: "V", other: "F" }[file.kind]}</span
+														>
+														<button
+															class="file-open"
+															type="button"
+															aria-label=${`Open ${file.name}`}
+															title=${file.name}
+															?disabled=${!file.url}
+															@click=${() => this.emit("open", file)}
+														>
+															${file.name}
+														</button>
+													</div>
+												</td>
+												<td><time>${new Date(file.ts).toLocaleDateString()}</time></td>
+												<td>${file.author}</td>
+												<td>
+													${file.channelName ? `# ${file.channelName}` : `# ${this.channelName}`}
+												</td>
+												<td>
+													<teams-file-actions
+														.file=${file}
+														.client=${this.client}
+													></teams-file-actions>
+												</td>
+											</tr>`
     ) : html`<tr>
 										<td colspan="5" class="none">
 											${this.query.trim() ? "No matching files." : "No files shared yet."}
@@ -1936,18 +1937,20 @@ function themeChoices(current, change) {
   return html`<div class="theme-options" role="group" aria-label="Theme">
 		${["system", "light", "dark"].map(
     (theme) => html`<button
-				type="button"
-				aria-pressed=${String(current === theme)}
-				@click=${() => change(theme)}
-			>
-				<span class="theme-swatch" data-theme=${theme} aria-hidden="true">
-					<span class="preview-toolbar"></span>
-					<span class="preview-rail"></span>
-					<span class="preview-sidebar"><i></i><i></i><i></i></span>
-					<span class="preview-conversation"><i></i><i></i><i></i></span>
-				</span>
-				<span>${theme === "system" ? "Follow system" : theme === "light" ? "Light" : "Dark"}</span>
-			</button>`
+					type="button"
+					aria-pressed=${String(current === theme)}
+					@click=${() => change(theme)}
+				>
+					<span class="theme-swatch" data-theme=${theme} aria-hidden="true">
+						<span class="preview-toolbar"></span>
+						<span class="preview-rail"></span>
+						<span class="preview-sidebar"><i></i><i></i><i></i></span>
+						<span class="preview-conversation"><i></i><i></i><i></i></span>
+					</span>
+					<span
+						>${theme === "system" ? "Follow system" : theme === "light" ? "Light" : "Dark"}</span
+					>
+				</button>`
   )}
 	</div>`;
 }
@@ -1971,27 +1974,27 @@ function densityChoices(density, change) {
 		<legend>Chat density</legend>
 		${["comfy", "compact"].map(
     (value) => html`<label class="density-choice">
-				<input
-					type="radio"
-					name="chat-density"
-					value=${value}
-					.checked=${density === value}
-					@change=${() => change(value)}
-				/>
-				<span class="density-preview" data-density=${value} aria-hidden="true">
-					${[0, 1, 2].map(
+					<input
+						type="radio"
+						name="chat-density"
+						value=${value}
+						.checked=${density === value}
+						@change=${() => change(value)}
+					/>
+					<span class="density-preview" data-density=${value} aria-hidden="true">
+						${[0, 1, 2].map(
       () => html`<span class="preview-message"
-								><i></i><span><b></b><b></b></span
-							></span>`
+									><i></i><span><b></b><b></b></span
+								></span>`
     )}
-				</span>
-				<span class="density-caption"
-					><strong>${value === "comfy" ? "Comfy" : "Compact"}</strong>
-					<small
-						>${value === "comfy" ? "More space between messages" : "More messages in less space"}</small
-					></span
-				>
-			</label>`
+					</span>
+					<span class="density-caption"
+						><strong>${value === "comfy" ? "Comfy" : "Compact"}</strong>
+						<small
+							>${value === "comfy" ? "More space between messages" : "More messages in less space"}</small
+						></span
+					>
+				</label>`
   )}
 	</fieldset>`;
 }
@@ -2414,7 +2417,9 @@ var safeStorage = {
 };
 function loadIdentity() {
   try {
-    const raw = JSON.parse(safeStorage.getItem("teams:identity") ?? "null");
+    const raw = JSON.parse(
+      safeStorage.getItem("teams:identity") ?? "null"
+    );
     if (raw && typeof raw.id === "string" && typeof raw.name === "string" && raw.name.trim())
       return { id: raw.id, name: raw.name };
   } catch {
@@ -2512,32 +2517,32 @@ function followedThreads(state, client, open, unreadOnly, filter) {
 		<ul>
 			${threads.length ? threads.map(
     (thread) => html`<li data-unread=${String(thread.unread > 0)}>
-								<button
-									type="button"
-									@click=${() => open(thread)}
-									aria-label=${`Open thread in ${thread.channelName}: ${thread.root.deleted ? "Deleted message" : thread.root.text}`}
-								>
-									<strong># ${thread.channelName}</strong
-									><span
-										>${thread.root.deleted ? "This message was deleted" : thread.root.text || "Shared file"}</span
+									<button
+										type="button"
+										@click=${() => open(thread)}
+										aria-label=${`Open thread in ${thread.channelName}: ${thread.root.deleted ? "Deleted message" : thread.root.text}`}
 									>
-									<small
-										>${thread.replyCount} ${thread.replyCount === 1 ? "reply" : "replies"} ·
-										${new Date(thread.updatedAt).toLocaleString()}</small
-									></button
-								><span>${thread.unread > 0 ? `${thread.unread} unread` : "Read"}</span
-								><button
-									type="button"
-									@click=${() => client.markThreadRead(thread.channelId, thread.root.id, thread.unread > 0)}
-								>
-									${thread.unread > 0 ? "Mark as read" : "Mark as unread"}</button
-								><button
-									type="button"
-									@click=${() => client.followThread(thread.channelId, thread.root.id, false)}
-								>
-									Unfollow thread
-								</button>
-							</li>`
+										<strong># ${thread.channelName}</strong
+										><span
+											>${thread.root.deleted ? "This message was deleted" : thread.root.text || "Shared file"}</span
+										>
+										<small
+											>${thread.replyCount} ${thread.replyCount === 1 ? "reply" : "replies"} ·
+											${new Date(thread.updatedAt).toLocaleString()}</small
+										></button
+									><span>${thread.unread > 0 ? `${thread.unread} unread` : "Read"}</span
+									><button
+										type="button"
+										@click=${() => client.markThreadRead(thread.channelId, thread.root.id, thread.unread > 0)}
+									>
+										${thread.unread > 0 ? "Mark as read" : "Mark as unread"}</button
+									><button
+										type="button"
+										@click=${() => client.followThread(thread.channelId, thread.root.id, false)}
+									>
+										Unfollow thread
+									</button>
+								</li>`
   ) : html`<li>
 							${unreadOnly ? "No unread followed threads." : "No followed threads yet. Open a thread and choose Follow thread."}
 						</li>`}
@@ -2845,19 +2850,19 @@ var TeamsAddTabDialog = class extends LitElement {
 							<div class="apps">
 								${APPS.map(
       (entry, index) => html`<button
-										type="button"
-										class="app"
-										aria-label=${`Choose ${entry.label}`}
-										?data-first-app=${index === 0}
-										?autofocus=${index === 0}
-										@click=${() => this.choose(entry.id)}
-									>
-										<span class="badge" data-kind=${entry.kind ?? "other"}>${entry.letter}</span
-										><strong>${entry.label}</strong>
-										<small
-											>${entry.kind ? this.availableLabel(entry.kind) : "Add a web address"}</small
+											type="button"
+											class="app"
+											aria-label=${`Choose ${entry.label}`}
+											?data-first-app=${index === 0}
+											?autofocus=${index === 0}
+											@click=${() => this.choose(entry.id)}
 										>
-									</button>`
+											<span class="badge" data-kind=${entry.kind ?? "other"}>${entry.letter}</span
+											><strong>${entry.label}</strong>
+											<small
+												>${entry.kind ? this.availableLabel(entry.kind) : "Add a web address"}</small
+											>
+										</button>`
     )}
 							</div>
 							<p class="hint">File tabs use files already shared in this channel.</p>
@@ -3694,20 +3699,20 @@ var TeamsApp = class extends LitElement {
 					${s.searchQuery ? html`<ul class="results" role="listbox" aria-label="Search results">
 									${s.searchResults.length === 0 ? html`<li class="none">No results</li>` : s.searchResults.map(
       (h) => html`<li>
-														<button
-															type="button"
-															@click=${() => {
+															<button
+																type="button"
+																@click=${() => {
         if (this.selectChannel(h.channelId)) {
           this.teams.client?.search("");
           void this.openThread(h.message.id);
         }
       }}
-														>
-															<strong>${h.message.authorName}</strong>
-															<span class="in">in # ${h.channelName}</span>
-															<span class="snippet">${h.message.text.slice(0, 100)}</span>
-														</button>
-													</li>`
+															>
+																<strong>${h.message.authorName}</strong>
+																<span class="in">in # ${h.channelName}</span>
+																<span class="snippet">${h.message.text.slice(0, 100)}</span>
+															</button>
+														</li>`
     )}
 								</ul>` : nothing}
 				</div>
@@ -3741,15 +3746,15 @@ var TeamsApp = class extends LitElement {
 				<ul class="plain">
 					${s.channels.map(
         (c) => html`<li>
-							<span># ${c.name}</span>
-							<button
-								type="button"
-								class=${c.live ? "join live" : "join"}
-								@click=${() => this.startMeeting(c.id)}
-							>
-								${c.live ? "Join" : "Meet now"}
-							</button>
-						</li>`
+								<span># ${c.name}</span>
+								<button
+									type="button"
+									class=${c.live ? "join live" : "join"}
+									@click=${() => this.startMeeting(c.id)}
+								>
+									${c.live ? "Join" : "Meet now"}
+								</button>
+							</li>`
       )}
 				</ul>
 				${live2.length === 0 ? html`<p class="hint">Nobody is in a call right now.</p>` : nothing}
@@ -3817,13 +3822,13 @@ var TeamsApp = class extends LitElement {
 							<nav class="tabs" role="tablist">
 								${["posts", "files"].map(
       (t) => html`<button
-										type="button"
-										role="tab"
-										aria-selected=${String(this.tab === t)}
-										@click=${() => this.selectTab(t)}
-									>
-										${t === "posts" ? "Posts" : "Shared"}
-									</button>`
+											type="button"
+											role="tab"
+											aria-selected=${String(this.tab === t)}
+											@click=${() => this.selectTab(t)}
+										>
+											${t === "posts" ? "Posts" : "Shared"}
+										</button>`
     )}
 								${s.tabs.map((t) => html`<button type="button" role="tab" aria-selected=${String(this.tab === t.id)} @click=${() => this.selectTab(t.id)}>${t.name}</button>`)}
 							</nav>
@@ -4084,14 +4089,14 @@ var TeamsApp = class extends LitElement {
 										<ul class="plain">
 											${call.participants.map(
       (p) => html`<li>
-													<office-ui-avatar
-														size="sm"
-														name=${p.name}
-														seed=${p.id}
-													></office-ui-avatar>
-													<span>${p.name}${p.self ? " (you)" : ""}</span>
-													${p.state.hand ? html`<span title="Hand raised">✋</span>` : nothing}
-												</li>`
+														<office-ui-avatar
+															size="sm"
+															name=${p.name}
+															seed=${p.id}
+														></office-ui-avatar>
+														<span>${p.name}${p.self ? " (you)" : ""}</span>
+														${p.state.hand ? html`<span title="Hand raised">✋</span>` : nothing}
+													</li>`
     )}
 										</ul>
 									</aside>` : nothing}

package/dist/{chunk-VAR6O7II.js → chunk-KF72ZA6V.js}

@@ -1,7 +1,7 @@
 import { defineSmartArt } from './chunk-PXIYHFZ5.js';
-import { TEAMS_TAGS, registerTeams } from './chunk-6UPGM3X2.js';
+import { TEAMS_TAGS, registerTeams } from './chunk-7US5GCXF.js';
 import { installOfficeUiTheme } from './chunk-BCH2ZLWI.js';
-import { registerControls } from './chunk-SCWCZSTE.js';
+import { registerControls } from './chunk-O7APCA5N.js';
 import { definePresence } from './chunk-L7JV5FVE.js';
 
 // src/index.ts
@@ -45,6 +45,8 @@ var OFFICE_UI_TAGS = [
   "office-ui-gallery",
   "office-ui-comments-pane",
   "office-ui-symbol-picker",
+  "office-ui-color-grid",
+  "office-ui-color-custom",
   "office-ui-presence",
   "office-ui-smartart",
   ...TEAMS_TAGS