ooxml-ui 0.30.1 → 1.0.0

package/dist/{chunk-4VKD3COE.js → chunk-T3HB5LMH.js}

@@ -1,7 +1,7 @@
-import { createIconSvg, paintIcon, getIcon } from './chunk-HZ422LTR.js';
-import { initialsOf } from './chunk-4TSBX6J3.js';
-import { OfficeElement, controlStyles, definer, valueOn, flag, present, triState, withTokens } from './chunk-ZWBP2WTC.js';
-import { tok, OFFICE_TOKENS } from './chunk-7Q7ZS2CC.js';
+import { createIconSvg, paintIcon, getIcon } from './chunk-BOX43CZD.js';
+import { initialsOf } from './chunk-OXKWNNNJ.js';
+import { OfficeElement, controlStyles, definer, valueOn, flag, present, triState, withTokens } from './chunk-ZV2Z4IWH.js';
+import { tok, OFFICE_TOKENS } from './chunk-JFJXBYRD.js';
 import { html, LitElement, nothing, render, svg } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { repeat } from 'lit/directives/repeat.js';
@@ -489,6 +489,23 @@ var OfficeUiRadio = class extends OfficeElement {
   }
 };
 var defineRadio = definer("office-ui-radio", () => OfficeUiRadio);
+
+// src/form/color-swatches.ts
+var OFFICE_COLOR_SWATCHES = [
+  { hex: "#000000", label: "Black" },
+  { hex: "#ffffff", label: "White" },
+  { hex: "#ff0000", label: "Red" },
+  { hex: "#00aa00", label: "Green" },
+  { hex: "#0000ff", label: "Blue" },
+  { hex: "#ff8800", label: "Orange" },
+  { hex: "#8800cc", label: "Purple" },
+  { hex: "#00cccc", label: "Cyan" },
+  { hex: "#ff69b4", label: "Pink" },
+  { hex: "#808080", label: "Gray" }
+];
+var OFFICE_COLOR_SWATCH_HEXES = OFFICE_COLOR_SWATCHES.map(
+  (swatch) => swatch.hex
+);
 var OfficeUiCheckable = class extends OfficeElement {
   static formAssociated = true;
   static properties = {
@@ -1628,7 +1645,7 @@ var defineRibbonSection = definer(
 );
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/ribbon/gallery.css?raw
-var gallery_default = "[data-office-gallery] {\n	display: inline-flex;\n	position: relative;\n	flex: none;\n	color: var(--office-foreground);\n}\n[data-office-gallery] .gallery-view {\n	display: contents;\n}\n[data-office-gallery] button {\n	box-sizing: border-box;\n	font: inherit;\n	color: inherit;\n	cursor: pointer;\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius);\n	background: var(--office-background);\n}\n[data-office-gallery] button:hover:not(:disabled) {\n	background: var(--office-selected);\n}\n[data-office-gallery] button:disabled {\n	opacity: 0.4;\n	cursor: not-allowed;\n}\n[data-office-gallery] button:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: var(--office-focus-offset);\n}\n[data-office-gallery] .trigger {\n	display: inline-flex;\n	align-items: center;\n	gap: var(--office-space-1-5);\n	min-height: var(--office-gallery-trigger-height);\n	padding: 0 var(--office-space-1-5);\n	font-size: var(--office-font-size-sm);\n	white-space: nowrap;\n}\n[data-office-gallery]:not([mode='inline']) .trigger {\n	border-color: transparent;\n	background: transparent;\n}\n[data-office-gallery] .trigger svg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\n[data-office-gallery][mode='inline'] .trigger,\n[data-office-gallery][chevron-only] .trigger {\n	align-self: stretch;\n	padding: 0 var(--office-space-1);\n}\n[data-office-gallery] .strip {\n	display: flex;\n	gap: var(--office-space-0);\n	padding: var(--office-space-0);\n	align-items: center;\n}\n[data-office-gallery] .tile {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	flex: none;\n	padding: var(--office-space-0);\n}\n[data-office-gallery] .tile[aria-pressed='true'] {\n	border: var(--office-border-width-thick) solid var(--office-accent);\n	background: color-mix(in srgb, var(--office-accent) 15%, var(--office-background));\n}\n[data-office-gallery] .tile svg {\n	max-width: 100%;\n	max-height: 100%;\n}\n[data-office-gallery][mode='inline'] .strip {\n	gap: 0;\n	border: var(--office-border-width) solid var(--office-border);\n	border-inline-end: 0;\n	border-radius: var(--office-radius-sm) 0 0 var(--office-radius-sm);\n	background: var(--office-gallery-strip-background);\n}\n[data-office-gallery][mode='inline'] .trigger {\n	border-radius: 0 var(--office-radius-sm) var(--office-radius-sm) 0;\n	background: var(--office-gallery-strip-background);\n}\n[data-office-gallery] .trigger.command {\n	border-color: transparent;\n	background: transparent;\n	justify-content: flex-start;\n}\n[data-office-gallery] .trigger.command:hover:not(:disabled) {\n	border-color: var(--office-border);\n	background: var(--office-selected);\n}\n[data-office-gallery] .trigger.command svg {\n	color: var(--office-command-icon-color);\n}\n[data-office-gallery] .trigger.command-large {\n	flex-direction: column;\n	align-items: center;\n	justify-content: flex-start;\n	gap: var(--office-space-0);\n	min-width: var(--office-gallery-command-min-width);\n	max-width: var(--office-gallery-command-max-width);\n	height: var(--office-gallery-command-height);\n	padding: var(--office-space-1);\n	font-size: var(--office-font-size-2xs);\n	line-height: var(--office-line-height-tight);\n	white-space: normal;\n	text-align: center;\n}\n[data-office-gallery] .trigger.command-large svg {\n	width: var(--office-gallery-command-icon);\n	height: var(--office-gallery-command-icon);\n}\n[data-office-gallery] .popup {\n	box-sizing: border-box;\n	position: fixed;\n	z-index: var(--office-z-popover);\n	max-width: calc(100vw - var(--office-space-4));\n	max-height: var(--office-gallery-popup-max-height);\n	overflow: auto;\n	padding: var(--office-space-2);\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius-md);\n	background: var(--office-popover);\n	color: var(--office-popover-foreground);\n	box-shadow: var(--office-shadow-lg);\n}\n[data-office-gallery] .popup[hidden] {\n	display: none;\n}\n[data-office-gallery] .grid {\n	display: grid;\n	gap: var(--office-space-1);\n	width: max-content;\n	max-width: 100%;\n}\n[data-office-gallery] .heading {\n	margin: var(--office-space-1) 0 var(--office-space-1-5);\n	font-size: var(--office-font-size-xs);\n	font-weight: var(--office-font-weight-bold);\n}\n[data-office-gallery] .section + .section {\n	margin-top: var(--office-space-2-5);\n}\n@media (pointer: coarse), (max-width: 1023px) {\n	[data-office-gallery] .trigger,\n	[data-office-gallery] .tile {\n		min-height: var(--office-target-size-touch);\n		min-width: var(--office-target-size-touch);\n	}\n}\n@media (forced-colors: active) {\n	[data-office-gallery] button,\n	[data-office-gallery] .popup {\n		color: ButtonText;\n		background: Canvas;\n		border-color: ButtonText;\n	}\n	[data-office-gallery] button:disabled {\n		color: GrayText;\n		opacity: 1;\n	}\n	[data-office-gallery] button:focus-visible,\n	[data-office-gallery] .tile[aria-pressed='true'] {\n		outline: var(--office-focus-width) solid Highlight;\n		border-color: Highlight;\n	}\n}\n";
+var gallery_default = "[data-office-gallery] {\n	display: inline-flex;\n	position: relative;\n	flex: none;\n	color: var(--office-foreground);\n}\n[data-office-gallery] .gallery-view {\n	display: contents;\n}\n[data-office-gallery] button {\n	box-sizing: border-box;\n	font: inherit;\n	color: inherit;\n	cursor: pointer;\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius);\n	background: var(--office-background);\n}\n[data-office-gallery] button:hover:not(:disabled) {\n	background: var(--office-selected);\n}\n[data-office-gallery] button:disabled {\n	opacity: 0.4;\n	cursor: not-allowed;\n}\n[data-office-gallery] button:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: var(--office-focus-offset);\n}\n[data-office-gallery] .trigger {\n	display: inline-flex;\n	align-items: center;\n	gap: var(--office-space-1-5);\n	min-height: var(--office-gallery-trigger-height);\n	padding: 0 var(--office-space-1-5);\n	font-size: var(--office-font-size-sm);\n	white-space: nowrap;\n}\n[data-office-gallery]:not([mode='inline']) .trigger {\n	border-color: transparent;\n	background: transparent;\n}\n[data-office-gallery] .trigger svg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\n[data-office-gallery][mode='inline'] .trigger,\n[data-office-gallery][chevron-only] .trigger {\n	align-self: stretch;\n	padding: 0 var(--office-space-1);\n}\n[data-office-gallery] .strip {\n	display: flex;\n	gap: var(--office-space-0);\n	padding: var(--office-space-0);\n	align-items: center;\n}\n[data-office-gallery] .tile {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	flex: none;\n	padding: var(--office-space-0);\n}\n[data-office-gallery] .tile[aria-pressed='true'] {\n	border: var(--office-border-width-thick) solid var(--office-accent);\n	background: color-mix(in srgb, var(--office-accent) 15%, var(--office-background));\n}\n[data-office-gallery] .tile svg {\n	max-width: 100%;\n	max-height: 100%;\n}\n[data-office-gallery][mode='inline'] .strip {\n	gap: 0;\n	border: var(--office-border-width) solid var(--office-border);\n	border-inline-end: 0;\n	border-radius: var(--office-radius-sm) 0 0 var(--office-radius-sm);\n	background: var(--office-gallery-strip-background);\n}\n[data-office-gallery][mode='inline'] .trigger {\n	border-radius: 0 var(--office-radius-sm) var(--office-radius-sm) 0;\n	background: var(--office-gallery-strip-background);\n}\n[data-office-gallery] .trigger.command {\n	border-color: transparent;\n	background: transparent;\n	justify-content: flex-start;\n}\n[data-office-gallery] .trigger.command:hover:not(:disabled) {\n	border-color: var(--office-border);\n	background: var(--office-selected);\n}\n[data-office-gallery] .trigger.command svg {\n	color: var(--office-command-icon-color);\n}\n[data-office-gallery] .trigger.command-large {\n	flex-direction: column;\n	align-items: center;\n	justify-content: flex-start;\n	gap: var(--office-space-0);\n	min-width: var(--office-gallery-command-min-width);\n	max-width: var(--office-gallery-command-max-width);\n	height: var(--office-gallery-command-height);\n	padding: var(--office-space-1);\n	font-size: var(--office-font-size-2xs);\n	line-height: var(--office-line-height-tight);\n	white-space: normal;\n	text-align: center;\n}\n[data-office-gallery] .trigger.command-large svg {\n	width: var(--office-gallery-command-icon);\n	height: var(--office-gallery-command-icon);\n}\n[data-office-gallery] .popup {\n	box-sizing: border-box;\n	position: fixed;\n	z-index: var(--office-z-popover);\n	max-width: calc(100vw - var(--office-space-4));\n	max-height: var(--office-gallery-popup-max-height);\n	overflow: auto;\n	padding: var(--office-space-2);\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius-md);\n	background: var(--office-popover);\n	color: var(--office-popover-foreground);\n	box-shadow: var(--office-shadow-lg);\n}\n[data-office-gallery] .popup[hidden] {\n	display: none;\n}\n[data-office-gallery] .grid {\n	display: grid;\n	gap: var(--office-space-1);\n	width: max-content;\n	max-width: 100%;\n}\n[data-office-gallery] .heading {\n	margin: var(--office-space-1) 0 var(--office-space-1-5);\n	font-size: var(--office-font-size-xs);\n	font-weight: var(--office-font-weight-bold);\n}\n[data-office-gallery] .section + .section {\n	margin-top: var(--office-space-2-5);\n}\n[data-office-gallery][mode='panel'] {\n	display: block;\n}\n[data-office-gallery][mode='panel'] .grid {\n	width: 100%;\n}\n[data-office-gallery][mode='panel'] .tile {\n	flex-direction: column;\n	gap: var(--office-space-1);\n	width: 100% !important;\n	height: auto !important;\n	min-height: var(--office-target-size-touch);\n	padding: var(--office-space-1);\n}\n[data-office-gallery][mode='panel'] .tile-label {\n	font-size: var(--office-font-size-xs);\n}\n[data-office-gallery][mode='panel'] .tile svg {\n	width: var(--office-gallery-preview-width);\n	height: var(--office-gallery-preview-height);\n}\n@media (pointer: coarse), (max-width: 1023px) {\n	[data-office-gallery] .trigger,\n	[data-office-gallery] .tile {\n		min-height: var(--office-target-size-touch);\n		min-width: var(--office-target-size-touch);\n	}\n}\n@media (forced-colors: active) {\n	[data-office-gallery] button,\n	[data-office-gallery] .popup {\n		color: ButtonText;\n		background: Canvas;\n		border-color: ButtonText;\n	}\n	[data-office-gallery] button:disabled {\n		color: GrayText;\n		opacity: 1;\n	}\n	[data-office-gallery] button:focus-visible,\n	[data-office-gallery] .tile[aria-pressed='true'] {\n		outline: var(--office-focus-width) solid Highlight;\n		border-color: Highlight;\n	}\n}\n";
 
 // src/ribbon/gallery-styles.ts
 var GALLERY_LIGHT_CSS = withTokens(gallery_default);
@@ -1697,6 +1714,7 @@ var OfficeUiGallery = class extends OfficeElement {
   opened = false;
   attributeChangedCallback(name, old, value) {
     super.attributeChangedCallback(name, old, value);
+    if (name === "mode" && value === "panel") this.close();
     this.requestUpdate();
   }
   get state() {
@@ -1717,7 +1735,7 @@ var OfficeUiGallery = class extends OfficeElement {
     return this.opened;
   }
   set open(value) {
-    const next = present(value) && !this.unavailable();
+    const next = present(value) && !this.unavailable() && this.getAttribute("mode") !== "panel";
     if (next === this.opened) return;
     this.opened = next;
     this.cleanup();
@@ -1785,8 +1803,10 @@ var OfficeUiGallery = class extends OfficeElement {
     const state = this.model;
     if (this.unavailable() || !state?.sections.some((section) => section.items.some((item) => item.id === itemId)))
       return;
-    this.close();
-    this.trigger.focus();
+    if (this.getAttribute("mode") !== "panel") {
+      this.close();
+      this.trigger.focus();
+    }
     this.fire(this.constructor.pickEvent, { gallery: state.id, itemId });
   }
   onTrigger() {
@@ -1797,6 +1817,29 @@ var OfficeUiGallery = class extends OfficeElement {
     this.open = !this.open;
   }
   onKey(event) {
+    const panel = this.getAttribute("mode") === "panel";
+    if (panel || this.open) {
+      const target = event.target;
+      const tile = target.closest(".tile");
+      const section = tile?.closest(".section");
+      const items = Array.from(
+        (panel ? section : this.popup)?.querySelectorAll(
+          ".tile:not(:disabled)"
+        ) ?? []
+      );
+      const index = tile ? items.indexOf(tile) : -1;
+      const columns = this.model?.sections[Array.from(this.querySelectorAll(".section")).indexOf(section)]?.columns ?? 1;
+      const delta = { ArrowRight: 1, ArrowLeft: -1, ArrowDown: columns, ArrowUp: -columns }[event.key];
+      const next = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : delta === void 0 ? -1 : (index + delta + items.length) % items.length;
+      if (index >= 0 && next >= 0) {
+        event.preventDefault();
+        event.stopPropagation();
+        items[next]?.focus();
+        if (panel) items[next]?.click();
+        return;
+      }
+      if (panel) return;
+    }
     const trigger = this.trigger;
     if (event.key === "Escape" && this.open) {
       event.stopPropagation();
@@ -1851,14 +1894,22 @@ var OfficeUiGallery = class extends OfficeElement {
 			aria-pressed=${String(item.applied === true)}
 			aria-label=${item.label}
 			title=${item.label}
-			style="width:${width + 6}px;height:${height + 6}px"
+			style="width:${width + 6}px;height:${height + 6}px;--office-gallery-preview-width:${width}px;--office-gallery-preview-height:${height}px"
 			@click=${() => this.pick(item.id)}
-		>${preview}</button>`;
+		>${preview}${this.getAttribute("mode") === "panel" ? html`<span class="tile-label">${item.label}</span>` : ""}</button>`;
   }
   lightTemplate() {
     const statics = this.constructor;
     const state = this.model;
     const disabled = this.unavailable();
+    if (this.getAttribute("mode") === "panel")
+      return html`<div
+				class="gallery-panel"
+				role="group"
+				aria-label=${state?.label ?? ""}
+				@keydown=${this.onKey}
+				>${(state?.sections ?? []).map((section) => this.section(section, disabled))}</div
+			>`;
     const inline = this.getAttribute("mode") === "inline" && !this.hasAttribute("chevron-only");
     const chevronOnly = this.hasAttribute("chevron-only");
     const command = state?.command;
@@ -2873,11 +2924,75 @@ var OfficeUiMenuSeparator = class extends OfficeElement {
 var defineMenuSeparator = definer("office-ui-menu-separator", () => OfficeUiMenuSeparator);
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/menu/menu-button.css?raw
-var menu_button_default = ":host {\n	display: inline-flex;\n	vertical-align: middle;\n}\n.wrap {\n	display: inline-flex;\n	align-items: stretch;\n	border: var(--office-border-width) solid transparent;\n	border-radius: var(--office-radius);\n}\n:host([variant='stacked']) .wrap {\n	flex-direction: column;\n}\nbutton {\n	box-sizing: border-box;\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	gap: var(--office-space-1);\n	min-width: var(--office-target-size);\n	min-height: var(--office-target-size);\n	padding: 0 var(--office-space-1-5);\n	border: 0;\n	border-radius: var(--office-radius);\n	background: transparent;\n	color: var(--office-foreground);\n	font: inherit;\n	font-size: var(--office-font-size-sm);\n	cursor: pointer;\n	white-space: nowrap;\n}\n:host([variant='stacked']) .main {\n	flex-direction: column;\n	padding: var(--office-space-1) var(--office-space-1-5) 0;\n}\n:host([variant='stacked']) .caret {\n	min-height: var(--office-icon-size-md);\n	padding: 0 var(--office-space-1-5) var(--office-space-0);\n}\n:host([variant='stacked']:not([command])) .main {\n	padding-bottom: 0;\n}\n.wrap:hover:not(.disabled) {\n	border-color: var(--office-border);\n}\nbutton:hover:not(:disabled) {\n	background: var(--office-surface);\n}\nbutton:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(-1 * var(--office-focus-width));\n}\nbutton:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\nbutton[aria-expanded='true'] {\n	background: var(--office-surface);\n}\n.caret svg {\n	width: var(--office-icon-size-sm);\n	height: var(--office-icon-size-sm);\n}\nsvg {\n	width: var(--office-icon-size-ml);\n	height: var(--office-icon-size-ml);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\nsvg:not([data-painted]) {\n	display: none;\n}\n.panel {\n	position: fixed;\n	inset: auto;\n	margin: 0;\n	min-width: var(--office-menu-min-width);\n	padding: var(--office-space-1);\n	box-sizing: border-box;\n	background: var(--office-background);\n	color: var(--office-foreground);\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius);\n	box-shadow: var(--office-shadow);\n}\n.panel[hidden] {\n	display: none;\n}\n\n@media (forced-colors: active) {\n	button {\n		color: ButtonText;\n	}\n	button:disabled {\n		color: GrayText;\n	}\n	.panel {\n		border-color: CanvasText;\n		background: Canvas;\n		color: CanvasText;\n	}\n}\n";
+var menu_button_default = ":host {\n	display: inline-flex;\n	vertical-align: middle;\n}\n:host([submenu]) {\n	display: flex;\n}\n:host([submenu]) .wrap {\n	width: 100%;\n}\n:host([submenu]) .main {\n	flex: 1;\n	justify-content: flex-start;\n	padding-left: var(--office-space-6);\n}\n.wrap {\n	display: inline-flex;\n	align-items: stretch;\n	border: var(--office-border-width) solid transparent;\n	border-radius: var(--office-radius);\n}\n:host([variant='stacked']) .wrap {\n	flex-direction: column;\n}\nbutton {\n	box-sizing: border-box;\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	gap: var(--office-space-1);\n	min-width: var(--office-target-size);\n	min-height: var(--office-target-size);\n	padding: 0 var(--office-space-1-5);\n	border: 0;\n	border-radius: var(--office-radius);\n	background: transparent;\n	color: var(--office-foreground);\n	font: inherit;\n	font-size: var(--office-font-size-sm);\n	cursor: pointer;\n	white-space: nowrap;\n}\n:host([variant='stacked']) .main {\n	flex-direction: column;\n	padding: var(--office-space-1) var(--office-space-1-5) 0;\n}\n:host([variant='stacked']) .caret {\n	min-height: var(--office-icon-size-md);\n	padding: 0 var(--office-space-1-5) var(--office-space-0);\n}\n:host([variant='stacked']:not([command])) .main {\n	padding-bottom: 0;\n}\n.wrap:hover:not(.disabled) {\n	border-color: var(--office-border);\n}\nbutton:hover:not(:disabled) {\n	background: var(--office-surface);\n}\nbutton:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(-1 * var(--office-focus-width));\n}\nbutton:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\nbutton[aria-expanded='true'] {\n	background: var(--office-surface);\n}\n.caret svg {\n	width: var(--office-icon-size-sm);\n	height: var(--office-icon-size-sm);\n}\nsvg {\n	width: var(--office-icon-size-ml);\n	height: var(--office-icon-size-ml);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\nsvg:not([data-painted]) {\n	display: none;\n}\n.panel {\n	position: fixed;\n	inset: auto;\n	margin: 0;\n	min-width: var(--office-menu-min-width);\n	padding: var(--office-space-1);\n	box-sizing: border-box;\n	background: var(--office-background);\n	color: var(--office-foreground);\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius);\n	box-shadow: var(--office-shadow);\n}\n.panel[hidden] {\n	display: none;\n}\n\n@media (forced-colors: active) {\n	button {\n		color: ButtonText;\n	}\n	button:disabled {\n		color: GrayText;\n	}\n	.panel {\n		border-color: CanvasText;\n		background: Canvas;\n		color: CanvasText;\n	}\n}\n";
+
+// raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/menu/menu-item.css?raw
+var menu_item_default = ":host {\n	display: block;\n}\n:host([hidden]) {\n	display: none;\n}\nbutton {\n	box-sizing: border-box;\n	display: flex;\n	align-items: center;\n	gap: var(--office-space-2);\n	width: 100%;\n	min-height: var(--office-target-size);\n	padding: 0 var(--office-space-2-5) 0 var(--office-space-2);\n	border: 0;\n	border-radius: var(--office-radius-sm);\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	font-size: var(--office-font-size-sm);\n	text-align: start;\n	cursor: pointer;\n}\nbutton:hover:not(:disabled),\nbutton:focus-visible {\n	background: var(--office-surface);\n	outline: none;\n}\nbutton:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\n.check {\n	width: var(--office-icon-size);\n	text-align: center;\n}\nsvg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	flex: none;\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\nsvg:not([data-painted]) {\n	visibility: hidden;\n}\n\n@media (forced-colors: active) {\n	button:focus-visible {\n		background: Highlight;\n		color: HighlightText;\n	}\n}\n";
+
+// src/menu/menu-item.ts
+var OfficeUiMenuItem = class extends OfficeElement {
+  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
+  static styles = controlStyles(menu_item_default);
+  static properties = {
+    label: { type: String },
+    icon: { type: String },
+    command: { type: String },
+    checked: { type: String },
+    disabled: flag
+  };
+  /** `title` is a native attribute, so it is watched rather than declared as a property. */
+  static get observedAttributes() {
+    return [...super.observedAttributes, "title"];
+  }
+  constructor() {
+    super();
+    this.label = "";
+    this.icon = null;
+    this.command = null;
+    this.checked = null;
+    this.disabled = false;
+  }
+  attributeChangedCallback(name, old, value) {
+    super.attributeChangedCallback(name, old, value);
+    if (name === "title") this.requestUpdate();
+  }
+  /** Focus the menuitem itself, so arrow navigation never depends on delegatesFocus. */
+  focus(options) {
+    this.renderRoot.querySelector("button")?.focus(options);
+  }
+  onClick() {
+    if (!present(this.disabled) && this.command)
+      this.fire("office-command", { command: this.command });
+  }
+  render() {
+    const checkable = this.checked !== null;
+    const on = checkable && this.checked !== "false";
+    return html`
+			<button
+				type="button"
+				tabindex="-1"
+				role=${checkable ? "menuitemcheckbox" : "menuitem"}
+				aria-checked=${ifDefined(checkable ? String(on) : void 0)}
+				title=${this.getAttribute("title") ?? ""}
+				?disabled=${present(this.disabled)}
+				@click=${this.onClick}
+			>
+				<span class="check" aria-hidden="true">${on ? "\u2713" : ""}</span>${glyph(this.icon)}<span
+					>${this.label}</span
+				>
+			</button>
+		`;
+  }
+};
+var defineMenuItem = definer("office-ui-menu-item", () => OfficeUiMenuItem);
 
 // src/menu/menu-button.ts
-var ENABLED_ITEMS = "office-ui-menu-item:not([disabled]):not([hidden])";
-var OfficeUiMenuButton = class extends OfficeElement {
+function menuOwner(element) {
+  for (let parent = element.parentElement; parent; parent = parent.parentElement)
+    if (parent instanceof OfficeUiMenuButton) return parent;
+  return void 0;
+}
+var OfficeUiMenuButton = class _OfficeUiMenuButton extends OfficeElement {
   static styles = controlStyles(menu_button_default);
   static properties = {
     label: { type: String },
@@ -2885,6 +3000,7 @@ var OfficeUiMenuButton = class extends OfficeElement {
     command: { type: String, reflect: true },
     keyshortcuts: { type: String },
     disabled: flag,
+    submenu: flag,
     iconOnly: { attribute: "icon-only", ...flag },
     open: { state: true }
   };
@@ -2900,6 +3016,7 @@ var OfficeUiMenuButton = class extends OfficeElement {
     this.command = null;
     this.keyshortcuts = null;
     this.disabled = false;
+    this.submenu = false;
     this.iconOnly = false;
     this.open = false;
     this.addEventListener("office-command", (event) => {
@@ -2924,13 +3041,30 @@ var OfficeUiMenuButton = class extends OfficeElement {
     return typeof (this.panel ?? HTMLElement.prototype).showPopover === "function";
   }
   items() {
-    return [...this.querySelectorAll(ENABLED_ITEMS)];
+    return [...this.querySelectorAll("*")].filter(
+      (item) => (item instanceof OfficeUiMenuItem || item instanceof _OfficeUiMenuButton && present(item.submenu)) && !present(item.disabled) && !item.hidden && menuOwner(item) === this
+    );
+  }
+  focus(options) {
+    this.renderRoot.querySelector(".main")?.focus(options);
   }
   toggle() {
+    if (present(this.submenu)) {
+      this.show(0);
+      return;
+    }
     if (this.open) this.hide(true);
     else this.show(0);
   }
   show(focusIndex) {
+    if (present(this.disabled)) return;
+    if (this.open) {
+      this.items()[focusIndex]?.focus();
+      return;
+    }
+    const parent = menuOwner(this);
+    for (const sibling of parent?.items() ?? [])
+      if (sibling !== this && sibling instanceof _OfficeUiMenuButton) sibling.hide(false);
     const panel = this.panel;
     const wrap = this.renderRoot.querySelector(".wrap");
     if (!panel || !wrap) return;
@@ -2955,6 +3089,11 @@ var OfficeUiMenuButton = class extends OfficeElement {
     const height = panel.offsetHeight;
     if (!view || !width) return;
     const maxLeft = view.innerWidth - width - 4;
+    if (present(this.submenu)) {
+      panel.style.left = `${Math.round(Math.max(4, Math.min(anchor.right + 2 + width > view.innerWidth ? anchor.left - width - 2 : anchor.right + 2, Math.max(4, maxLeft))))}px`;
+      panel.style.top = `${Math.round(Math.max(4, Math.min(anchor.top, view.innerHeight - height - 4)))}px`;
+      return;
+    }
     const left = anchor.left > maxLeft ? Math.max(4, anchor.right - width) : anchor.left;
     const top = anchor.bottom + 2 + height > view.innerHeight && anchor.top - height - 2 > 0 ? anchor.top - height - 2 : anchor.bottom + 2;
     panel.style.left = `${Math.round(Math.min(left, Math.max(4, maxLeft)))}px`;
@@ -2974,6 +3113,7 @@ var OfficeUiMenuButton = class extends OfficeElement {
       this.renderRoot.querySelector(this.split ? ".caret" : ".main")?.focus();
   }
   closed() {
+    for (const item of this.items()) if (item instanceof _OfficeUiMenuButton) item.hide(false);
     if (this.outside) this.ownerDocument.removeEventListener("pointerdown", this.outside, true);
     this.outside = void 0;
     this.open = false;
@@ -2984,8 +3124,9 @@ var OfficeUiMenuButton = class extends OfficeElement {
     else this.toggle();
   }
   onTriggerKey(event) {
-    if (event.key === "ArrowDown" && !present(this.disabled)) {
+    if ((event.key === "ArrowDown" || present(this.submenu) && event.key === "ArrowRight") && !present(this.disabled)) {
       event.preventDefault();
+      event.stopPropagation();
       this.show(0);
     }
   }
@@ -2996,14 +3137,16 @@ var OfficeUiMenuButton = class extends OfficeElement {
     );
     const move = (index) => {
       event.preventDefault();
+      event.stopPropagation();
       items[(index + items.length) % items.length]?.focus();
     };
     if (event.key === "ArrowDown") move(from + 1);
     else if (event.key === "ArrowUp") move(from - 1);
     else if (event.key === "Home") move(0);
     else if (event.key === "End") move(items.length - 1);
-    else if (event.key === "Escape") {
+    else if (event.key === "Escape" || present(this.submenu) && event.key === "ArrowLeft") {
       event.preventDefault();
+      event.stopPropagation();
       this.hide(true);
     } else if (event.key === "Tab") this.hide(false);
   }
@@ -3026,15 +3169,19 @@ var OfficeUiMenuButton = class extends OfficeElement {
 					aria-label=${ifDefined(iconOnly ? label : void 0)}
 					aria-keyshortcuts=${ifDefined(this.keyshortcuts || void 0)}
 					aria-haspopup=${ifDefined(split ? void 0 : "menu")}
+					role=${ifDefined(present(this.submenu) ? "menuitem" : void 0)}
+					tabindex=${present(this.submenu) ? -1 : 0}
 					aria-expanded=${ifDefined(split ? void 0 : String(open))}
 					?disabled=${disabled}
 					@click=${this.onMain}
 					@keydown=${this.onTriggerKey}
+					@pointerenter=${() => present(this.submenu) && this.show(-1)}
 					>${glyph(this.icon)}<span class="text" ?hidden=${iconOnly}>${label}</span></button
 				>
 				<!-- Without a split command the caret is decoration on one control, not a second button. -->
 				<button
 					class="caret"
+					part="caret"
 					type="button"
 					title=${split ? `${label} options` : title}
 					aria-label=${ifDefined(split ? `${label} options` : void 0)}
@@ -3045,7 +3192,7 @@ var OfficeUiMenuButton = class extends OfficeElement {
 					?disabled=${disabled}
 					@click=${() => !disabled && this.toggle()}
 					@keydown=${this.onTriggerKey}
-					>${glyph("chevronDown", "chevron")}</button
+					>${glyph(present(this.submenu) ? "chevronRight" : "chevronDown", "chevron")}</button
 				>
 			</div>
 			<div
@@ -3063,66 +3210,6 @@ var OfficeUiMenuButton = class extends OfficeElement {
 };
 var defineMenuButton = definer("office-ui-menu-button", () => OfficeUiMenuButton);
 
-// raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/menu/menu-item.css?raw
-var menu_item_default = ":host {\n	display: block;\n}\n:host([hidden]) {\n	display: none;\n}\nbutton {\n	box-sizing: border-box;\n	display: flex;\n	align-items: center;\n	gap: var(--office-space-2);\n	width: 100%;\n	min-height: var(--office-target-size);\n	padding: 0 var(--office-space-2-5) 0 var(--office-space-2);\n	border: 0;\n	border-radius: var(--office-radius-sm);\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	font-size: var(--office-font-size-sm);\n	text-align: start;\n	cursor: pointer;\n}\nbutton:hover:not(:disabled),\nbutton:focus-visible {\n	background: var(--office-surface);\n	outline: none;\n}\nbutton:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\n.check {\n	width: var(--office-icon-size);\n	text-align: center;\n}\nsvg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	flex: none;\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\nsvg:not([data-painted]) {\n	visibility: hidden;\n}\n\n@media (forced-colors: active) {\n	button:focus-visible {\n		background: Highlight;\n		color: HighlightText;\n	}\n}\n";
-
-// src/menu/menu-item.ts
-var OfficeUiMenuItem = class extends OfficeElement {
-  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
-  static styles = controlStyles(menu_item_default);
-  static properties = {
-    label: { type: String },
-    icon: { type: String },
-    command: { type: String },
-    checked: { type: String },
-    disabled: flag
-  };
-  /** `title` is a native attribute, so it is watched rather than declared as a property. */
-  static get observedAttributes() {
-    return [...super.observedAttributes, "title"];
-  }
-  constructor() {
-    super();
-    this.label = "";
-    this.icon = null;
-    this.command = null;
-    this.checked = null;
-    this.disabled = false;
-  }
-  attributeChangedCallback(name, old, value) {
-    super.attributeChangedCallback(name, old, value);
-    if (name === "title") this.requestUpdate();
-  }
-  /** Focus the menuitem itself, so arrow navigation never depends on delegatesFocus. */
-  focus(options) {
-    this.renderRoot.querySelector("button")?.focus(options);
-  }
-  onClick() {
-    if (!present(this.disabled) && this.command)
-      this.fire("office-command", { command: this.command });
-  }
-  render() {
-    const checkable = this.checked !== null;
-    const on = checkable && this.checked !== "false";
-    return html`
-			<button
-				type="button"
-				tabindex="-1"
-				role=${checkable ? "menuitemcheckbox" : "menuitem"}
-				aria-checked=${ifDefined(checkable ? String(on) : void 0)}
-				title=${this.getAttribute("title") ?? ""}
-				?disabled=${present(this.disabled)}
-				@click=${this.onClick}
-			>
-				<span class="check" aria-hidden="true">${on ? "\u2713" : ""}</span>${glyph(this.icon)}<span
-					>${this.label}</span
-				>
-			</button>
-		`;
-  }
-};
-var defineMenuItem = definer("office-ui-menu-item", () => OfficeUiMenuItem);
-
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/dialog/options-dialog.css?raw
 var options_dialog_default = ":host {\n	display: contents;\n}\noffice-ui-dialog {\n	--office-dialog-width: var(--office-options-width);\n	--office-dialog-max-width: var(--office-options-width);\n}\n.layout {\n	display: grid;\n	grid-template-columns: var(--office-options-nav-width) minmax(0, 1fr);\n	gap: 0;\n	min-height: var(--office-options-min-height);\n	margin: calc(-1 * var(--office-space-4));\n}\nnav {\n	display: flex;\n	flex-direction: column;\n	padding: var(--office-space-2) 0;\n	border-inline-end: var(--office-border-width) solid var(--office-border);\n	background: var(--office-surface);\n	overflow: auto;\n}\nnav button {\n	min-height: var(--office-options-row-height);\n	padding: var(--office-space-1) var(--office-space-3-5);\n	border: 0;\n	border-radius: 0;\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	text-align: start;\n	cursor: pointer;\n}\nnav button[aria-selected='true'] {\n	background: var(--office-selected);\n	font-weight: 600;\n	box-shadow: inset var(--office-selection-bar-width) 0 0 var(--office-accent);\n}\nnav button:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(-1 * var(--office-focus-width));\n}\n[role='tabpanel'] {\n	padding: var(--office-space-4) var(--office-space-5);\n	overflow: auto;\n}\n.lead {\n	margin: 0 0 var(--office-space-3);\n	font-size: var(--office-font-size-md);\n}\n.unavailable {\n	margin: 0 0 var(--office-space-3);\n	color: var(--office-muted-foreground);\n}\nsection + section {\n	margin-top: var(--office-space-4);\n}\nh3 {\n	margin: 0 0 var(--office-space-2);\n	padding-bottom: var(--office-space-1);\n	border-bottom: var(--office-border-width) solid var(--office-border);\n	font-size: var(--office-font-size);\n	font-weight: 600;\n}\n.desc {\n	margin: 0 0 var(--office-space-2);\n	color: var(--office-muted-foreground);\n}\n.row {\n	display: flex;\n	align-items: center;\n	gap: var(--office-space-2);\n	min-height: var(--office-options-row-height);\n}\n.row.indent {\n	padding-inline-start: var(--office-space-6);\n}\n.row.field > span:first-child {\n	min-width: var(--office-options-label-width);\n}\n.row[data-disabled] {\n	color: var(--office-muted-foreground);\n}\ninput[type='text'],\ninput[type='number'],\nselect {\n	min-height: var(--office-input-height);\n	box-sizing: border-box;\n	font: inherit;\n	border: var(--office-border-width) solid var(--office-border);\n	border-radius: var(--office-radius-sm);\n	background: var(--office-background);\n	color: inherit;\n}\ninput[type='number'] {\n	width: var(--office-options-number-width);\n}\n.info {\n	display: inline-grid;\n	place-items: center;\n	width: var(--office-info-size);\n	height: var(--office-info-size);\n	border: var(--office-border-width) solid currentColor;\n	border-radius: 50%;\n	font-size: var(--office-font-size-2xs);\n	color: var(--office-muted-foreground);\n	cursor: help;\n}\n.actions {\n	display: flex;\n	gap: var(--office-space-2);\n}\n.actions button {\n	min-width: var(--office-dialog-button-min-width);\n	min-height: var(--office-control-height-md);\n	font: inherit;\n	cursor: pointer;\n}\n@media (max-width: 600px) {\n	.layout {\n		grid-template-columns: 1fr;\n	}\n	nav {\n		flex-direction: row;\n		border-inline-end: 0;\n		border-bottom: var(--office-border-width) solid var(--office-border);\n	}\n	nav button {\n		white-space: nowrap;\n	}\n	.row.field {\n		flex-wrap: wrap;\n	}\n}\n";
 
@@ -4380,13 +4467,35 @@ var defineTitleBar = definer("office-ui-title-bar", () => OfficeUiTitleBar, [
 ]);
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/form/zoom-slider.css?raw
-var zoom_slider_default = ":host {\n	display: inline-flex;\n	align-items: center;\n	gap: var(--office-space-0);\n	font-size: var(--office-font-size-xs);\n	color: var(--office-foreground);\n	font-family: var(--office-font);\n}\nbutton {\n	box-sizing: border-box;\n	display: inline-grid;\n	place-items: center;\n	min-width: var(--office-target-size);\n	min-height: var(--office-target-size);\n	padding: 0;\n	border: var(--office-border-width) solid transparent;\n	border-radius: var(--office-radius);\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	font-size: var(--office-font-size-lg);\n	line-height: 1;\n	cursor: pointer;\n}\nbutton:hover:not(:disabled) {\n	background: var(--office-background);\n}\nbutton:focus-visible,\ninput:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(var(--office-focus-offset) / 2);\n}\nbutton:disabled,\ninput:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\ninput {\n	width: var(--office-zoom-slider-width);\n	min-width: var(--office-zoom-slider-min-width);\n	margin: 0 var(--office-space-0);\n	accent-color: var(--office-accent);\n}\noutput {\n	min-width: var(--office-zoom-value-width);\n	text-align: center;\n	font-variant-numeric: tabular-nums;\n}\nsvg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\n:host(:not([fit])) .fit {\n	display: none;\n}\n\n@media (pointer: coarse), (max-width: 767px) {\n	input {\n		flex: 1;\n	}\n}\n@media (forced-colors: active) {\n	button {\n		color: ButtonText;\n	}\n	button:disabled {\n		color: GrayText;\n	}\n}\n";
+var zoom_slider_default = ":host {\n	display: inline-flex;\n	align-items: center;\n	gap: var(--office-space-0);\n	font-size: var(--office-font-size-xs);\n	color: var(--office-foreground);\n	font-family: var(--office-font);\n}\nbutton {\n	box-sizing: border-box;\n	display: inline-grid;\n	place-items: center;\n	min-width: var(--office-target-size);\n	min-height: var(--office-target-size);\n	padding: 0;\n	border: var(--office-border-width) solid transparent;\n	border-radius: var(--office-radius);\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	font-size: var(--office-font-size-lg);\n	line-height: 1;\n	cursor: pointer;\n}\nbutton:hover:not(:disabled) {\n	background: var(--office-background);\n}\nbutton:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(var(--office-focus-offset) / 2);\n}\nbutton:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\ninput {\n	width: var(--office-zoom-slider-width);\n	min-width: var(--office-zoom-slider-min-width);\n	margin: 0 var(--office-space-0);\n}\noutput {\n	min-width: var(--office-zoom-value-width);\n	text-align: center;\n	font-variant-numeric: tabular-nums;\n}\nsvg {\n	width: var(--office-icon-size-md);\n	height: var(--office-icon-size-md);\n	fill: none;\n	stroke: currentColor;\n	stroke-width: var(--office-icon-stroke);\n	stroke-linecap: round;\n	stroke-linejoin: round;\n}\n:host(:not([fit])) .fit {\n	display: none;\n}\n\n@media (pointer: coarse), (max-width: 767px) {\n	input {\n		flex: 1;\n	}\n}\n@media (forced-colors: active) {\n	button {\n		color: ButtonText;\n	}\n	button:disabled {\n		color: GrayText;\n	}\n}\n";
+
+// raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/form/range-control.css?raw
+var range_control_default = ".office-range-control {\n	accent-color: var(--office-accent);\n}\n.office-range-control:focus-visible {\n	outline: var(--office-focus-width) solid var(--office-ring);\n	outline-offset: calc(var(--office-focus-offset) / 2);\n}\n.office-range-control:disabled {\n	opacity: 0.5;\n	cursor: not-allowed;\n}\n";
+function rangeControl(options) {
+  return html`<input
+		class="office-range-control"
+		type="range"
+		aria-label=${options.label}
+		aria-valuetext=${options.valueText}
+		min=${options.min}
+		max=${options.max}
+		step=${options.step ?? 1}
+		.value=${String(options.value)}
+		?disabled=${options.disabled}
+		@input=${(event) => {
+    if (!options.disabled) options.onInput(event.target.valueAsNumber);
+  }}
+		@change=${() => {
+    if (!options.disabled) options.onChange();
+  }}
+	/>`;
+}
 
 // src/form/zoom-slider.ts
 var clampTo = (value, min, max) => Math.min(max, Math.max(min, Math.round(value)));
 var finite = (value, fallback) => Number.isFinite(value) ? value : fallback;
 var OfficeUiZoomSlider = class extends OfficeElement {
-  static styles = controlStyles(zoom_slider_default);
+  static styles = controlStyles(zoom_slider_default, range_control_default);
   static properties = {
     // `value` clamps to the range, so it has a hand-written accessor below.
     value: { type: Number, reflect: true, noAccessor: true },
@@ -4462,17 +4571,16 @@ var OfficeUiZoomSlider = class extends OfficeElement {
 				@click=${() => this.stepBy(-1)}
 				>−</button
 			>
-			<input
-				type="range"
-				aria-label=${this.sliderLabel || "Zoom"}
-				aria-valuetext="${value}%"
-				min=${this.low}
-				max=${this.high}
-				.value=${String(value)}
-				?disabled=${disabled}
-				@input=${(event) => this.commit(event.target.valueAsNumber, "input")}
-				@change=${() => this.dispatchEvent(new Event("change", { bubbles: true, composed: true }))}
-			/>
+			${rangeControl({
+      label: this.sliderLabel || "Zoom",
+      value,
+      valueText: `${value}%`,
+      min: this.low,
+      max: this.high,
+      disabled,
+      onInput: (next) => this.commit(next, "input"),
+      onChange: () => this.dispatchEvent(new Event("change", { bubbles: true, composed: true }))
+    })}
 			<button
 				type="button"
 				aria-label=${inn}
@@ -4883,4 +4991,4 @@ function registerControls(registry) {
   for (const define of CONTROL_DEFINERS) define(registry);
 }
 
-export { CONTROL_DEFINERS, DEFAULT_OFFICE_PROFILE, EMPTY_MENU_STATE, OFFICE_AVATAR_SWATCHES, OFFICE_PROFILE_STORAGE_KEY, OFFICE_TITLE_BAR_SEARCH_LIMIT, OFFICE_TOAST_VISIBLE_LIMIT, assignKeyTips, attachKeyTips, clampFlyoutPosition, clampOptionNumber, clearOfficeProfile, createRibbonOverflow, defineAccount, defineBackstage, defineButton, defineCheckbox, defineCommandSearch, defineContextMenu, defineDialog, defineDialogFooter, defineFindBar, defineGallery, defineIcon, defineMenuButton, defineMenuItem, defineMenuSeparator, defineOptionsDialog, definePasteOptions, definePrintPreview, defineRadio, defineReadOnlyBanner, defineRibbon, defineRibbonGroup, defineRibbonSection, defineRibbonStack, defineRibbonToggle, defineRuler, defineSearchField, defineSelect, defineStatusBar, defineStatusItem, defineSwitch, defineTabStrip, defineTitleBar, defineToasts, defineToolbar, defineZoomSlider, glyph, nextEnabledIndex, parseSvgPreview, profileInitials, readOfficeProfile, registerControls, rulerDivisions, runKeyTips, sanitizeOfficeProfile, typeAheadIndex, writeOfficeProfile };
+export { CONTROL_DEFINERS, DEFAULT_OFFICE_PROFILE, EMPTY_MENU_STATE, OFFICE_AVATAR_SWATCHES, OFFICE_COLOR_SWATCHES, OFFICE_COLOR_SWATCH_HEXES, OFFICE_PROFILE_STORAGE_KEY, OFFICE_TITLE_BAR_SEARCH_LIMIT, OFFICE_TOAST_VISIBLE_LIMIT, assignKeyTips, attachKeyTips, clampFlyoutPosition, clampOptionNumber, clearOfficeProfile, createRibbonOverflow, defineAccount, defineBackstage, defineButton, defineCheckbox, defineCommandSearch, defineContextMenu, defineDialog, defineDialogFooter, defineFindBar, defineGallery, defineIcon, defineMenuButton, defineMenuItem, defineMenuSeparator, defineOptionsDialog, definePasteOptions, definePrintPreview, defineRadio, defineReadOnlyBanner, defineRibbon, defineRibbonGroup, defineRibbonSection, defineRibbonStack, defineRibbonToggle, defineRuler, defineSearchField, defineSelect, defineStatusBar, defineStatusItem, defineSwitch, defineTabStrip, defineTitleBar, defineToasts, defineToolbar, defineZoomSlider, glyph, nextEnabledIndex, parseSvgPreview, profileInitials, rangeControl, range_control_default, readOfficeProfile, registerControls, rulerDivisions, runKeyTips, sanitizeOfficeProfile, typeAheadIndex, writeOfficeProfile };

package/dist/{chunk-7QLJS57B.js → chunk-X7RINDJQ.js}

@@ -1,4 +1,4 @@
-import { OFFICE_TOKENS, TOUCH } from './chunk-7Q7ZS2CC.js';
+import { OFFICE_TOKENS, TOUCH } from './chunk-JFJXBYRD.js';
 
 // src/theme-bridge.ts
 var SHADCN_NAMES = [