ooxml-ui 1.12.2 → 1.13.0

package/dist/xlsx.js

@@ -1,18 +1,19 @@
+import { statusLayout, watchStatusWidth } from './chunk-UBBC5FH7.js';
 import { trackPointerGesture } from './chunk-GSXOZCAN.js';
-import './chunk-NLJVBHLG.js';
-import { syncRibbonAddIns } from './chunk-GI3WX6LZ.js';
-export { RIBBON_ADD_IN_EVENT } from './chunk-GI3WX6LZ.js';
-import { defineSmartArt } from './chunk-PXIYHFZ5.js';
-import { withExtension, saveExtension, downloadBytes, emit, emitEvent, blobFor, announceFileCommand, pickFile } from './chunk-3H5NR32A.js';
-export { XLSX_EDITOR_EVENTS } from './chunk-3H5NR32A.js';
-import './chunk-HZSYGNNB.js';
-import { shadcnBridge } from './chunk-S6ZXU442.js';
-import { range_control_default, createRibbonOverflow, defineBackstage, defineRibbon, defineRibbonActions, defineTitleBar, defineStatusBar, defineZoomSlider, rangeControl, defineDialog, runKeyTips, assignKeyTips, defineCheckbox, defineGallery, defineColorGrid, defineContextMenu, defineCommentsPane, parseSvgPreview } from './chunk-FUQYUUIQ.js';
+import './chunk-EL2A3BDM.js';
+import { syncRibbonAddIns } from './chunk-3XST4F6J.js';
+export { RIBBON_ADD_IN_EVENT } from './chunk-3XST4F6J.js';
+import { defineSmartArt } from './chunk-ANPFMQ6E.js';
+import { withExtension, saveExtension, downloadBytes, emit, emitEvent, blobFor, announceFileCommand, pickFile } from './chunk-D7JPVAYS.js';
+export { XLSX_EDITOR_EVENTS } from './chunk-D7JPVAYS.js';
+import './chunk-VRVFLYGI.js';
+import { shadcnBridge } from './chunk-7E3HU7RL.js';
+import { range_control_default, createRibbonOverflow, defineBackstage, defineRibbon, defineRibbonActions, defineTitleBar, defineStatusBar, defineZoomSlider, defineOptionsDialog, rangeControl, defineDialog, optionsLabels, runKeyTips, assignKeyTips, userInterfaceSection, personalizeSection, optionText, unavailableControl, unavailableCategory, defineGallery, defineColorGrid, defineContextMenu, defineCommentsPane, parseSvgPreview } from './chunk-BFPHRWEB.js';
 import { getIcon, registerIcon } from './chunk-M6GF5ED2.js';
-import { definePresence } from './chunk-L7JV5FVE.js';
-import { withTokens } from './chunk-OGNNNTKI.js';
-import './chunk-SPNWHKSR.js';
-import { SPECIAL_CODES, FRACTION_CODES, AUTOSUM_FUNCTIONS, themeToCssVars, lightTheme, darkTheme, ICON_ACCENTS, ICON_PATHS, normalizeThemeMode, applyThemeColors, parseSelectionRef, selectionRef, normalizeEditorLocale, DirtyState, createCommandRegistry, createDialogRegistry, activeRef, createSelectionModel, SheetSelections, translator, initialSelection, sheetBaseName, historyOf, onRibbonTabsChange, activeChart, editChart, ribbonTabs, isTabHidden, selectTab, setTabHidden, tabButton, searchCommands, formatNumber, TEMPLATES, createTemplateWorkbook, isMenuSeparator, registerRibbonTabs, installFormatPainter, SHEET_ICONS, clipboardCommands, fontCommands, alignmentCommands, numberCommands, cellCommands, editingCommands, pageLayoutCommands, pageBreakCommands, formulaCommands, dataCommands, contextualCommands, reviewTab, viewTab, helpTab, editBridge, CellViewCache, QUADRANTS, columnHeaderHeight, rowHeaderWidth, GridGeometry, cellRange, scrollToReveal, buildItems, fitNumber, cssFont, clampAddress, selectCell, movingEnd, extendSelection, moveWithinSelection, rowsRange, colsRange, ALL_RANGE, tabMenu, editing, icon, DATA_BAR_COLORS, dataBarRule, COLOR_SCALES, colorScaleRule, iconSetRule, target, tableAt, viewing, activeTable, numberFormatOptions, FONT_NAMES, FONT_SIZES, BORDER_PRESETS, ORIENTATIONS, ACCOUNTING_FORMATS, themePaletteItems, MARGIN_PRESETS, PAPER_SIZES, FUNCTION_MENUS, MORE_FUNCTION_CATEGORIES, functionsIn, isSingleCell, spanRange, selectionCellCount, addRange, activeStyle, selectSpecial, insertFunctionCall, guessHeader, regionOf, HIGHLIGHT_STYLES, ICON_SETS, TABLE_STYLES, tableStylePreview, resolveNameBox, absoluteReference, nameForRange, fillPaint, iconSvg, colSelected, rowSelected, rowHeaderMenu, columnHeaderMenu, cellMenu, recentFunctions, evaluateRef, buildChart, detectCategory, CATEGORIES, TIME_CODES, DATE_CODES, DEFAULT_OPTIONS, cellStyleItems, textDecoration, justify, alignItems, textAlign, hasBorders, edgeCss, diagonalSvg, SYMBOLS, buildCode, UNSET, dxfCss, negativeCodes, iconCount, iconThresholds, rowsOf, colsOf } from 'ooxml-core/xlsx/ui';
+import { definePresence } from './chunk-KNC2UEUR.js';
+import { withTokens } from './chunk-CWBSXK7P.js';
+import './chunk-LD3K2RDN.js';
+import { SPECIAL_CODES, FRACTION_CODES, translate, AUTOSUM_FUNCTIONS, themeToCssVars, lightTheme, darkTheme, ICON_ACCENTS, ICON_PATHS, normalizeEditorLocale, normalizeThemeMode, applyThemeColors, parseSelectionRef, selectionRef, DirtyState, createCommandRegistry, createDialogRegistry, activeRef, createSelectionModel, SheetSelections, translator, initialSelection, sheetBaseName, historyOf, onRibbonTabsChange, activeChart, editChart, ribbonTabs, isTabHidden, selectTab, setTabHidden, tabButton, searchCommands, formatNumber, TEMPLATES, createTemplateWorkbook, isMenuSeparator, registerRibbonTabs, installFormatPainter, SHEET_ICONS, clipboardCommands, fontCommands, alignmentCommands, numberCommands, cellCommands, editingCommands, pageLayoutCommands, pageBreakCommands, formulaCommands, dataCommands, contextualCommands, reviewTab, viewTab, helpTab, editBridge, CellViewCache, QUADRANTS, columnHeaderHeight, rowHeaderWidth, GridGeometry, cellRange, scrollToReveal, buildItems, fitNumber, cssFont, clampAddress, selectCell, movingEnd, extendSelection, moveWithinSelection, rowsRange, colsRange, ALL_RANGE, tabMenu, editing, icon, DATA_BAR_COLORS, dataBarRule, COLOR_SCALES, colorScaleRule, iconSetRule, target, tableAt, viewing, activeTable, numberFormatOptions, FONT_NAMES, FONT_SIZES, BORDER_PRESETS, ORIENTATIONS, ACCOUNTING_FORMATS, themePaletteItems, MARGIN_PRESETS, PAPER_SIZES, FUNCTION_MENUS, MORE_FUNCTION_CATEGORIES, functionsIn, isSingleCell, spanRange, selectionCellCount, addRange, activeStyle, selectSpecial, insertFunctionCall, guessHeader, regionOf, HIGHLIGHT_STYLES, ICON_SETS, TABLE_STYLES, tableStylePreview, resolveNameBox, absoluteReference, nameForRange, fillPaint, iconSvg, colSelected, rowSelected, rowHeaderMenu, columnHeaderMenu, cellMenu, recentFunctions, evaluateRef, buildChart, detectCategory, CATEGORIES, TIME_CODES, DATE_CODES, DEFAULT_OPTIONS, cellStyleItems, textDecoration, justify, alignItems, textAlign, hasBorders, edgeCss, diagonalSvg, SYMBOLS, buildCode, UNSET, dxfCss, negativeCodes, iconCount, iconThresholds, rowsOf, colsOf } from 'ooxml-core/xlsx/ui';
 export { EDITOR_LOCALES, THEME_KEYS, normalizeEditorLocale, registerRibbonTabs, themeToCssVars, darkTheme as xlsxDarkTheme, lightTheme as xlsxLightTheme } from 'ooxml-core/xlsx/ui';
 import { createWorksheet, createEditSession, approximateMeasure, createWorkbook, MAX_ROW, MAX_COL, chartView, createRefEvaluator, chartBarSpacing, CHART_FILL_PARTS, selectionStats, formatSelectionStat, printRange, formatRange, chartSeriesTransparencyPatch, chartSeriesTransparency, chartSeriesGradientPatch, chartSeriesSolidFillPatch, chartSeriesFillPatch, chartWithElementFills, chartElementTransparencyPatch, chartElementTransparency, chartElementGradientPatch, chartElementSolidFillPatch, chartElementFillPatch, chartElementFill, chartGradientStopTransparency, paginateWorksheet, resolveColor, DEFAULT_THEME, pageHeaderFooter, createGridMetrics, createPrintMergeIndex, formatAddress, cellView, renderHeaderFooterRuns, nextSheetName, FUNCTION_CATALOG, mergeAt, visibleCells, getCell, cellInputText, closeParens, isFormulaText, parseCellInput, referenceTarget, navigate, anchorToPixelBox, renderChartSvg, pixelBoxToAnchor, listValidationOptions, validationAt, getValue, resolvePasteOptions, DEFAULT_COL_WIDTH, nameAtCaret, functionMatches, callAtCaret, splice, acceptsReference, translateFormula, isCellError, layoutRemoteSelections, parseHtmlTable, toggleAbsolute, rangeContains, formatValue, isDateFormat, pictureAnchorAt, selectedSparklineGroups, pivotTableAt, validateDefinedName, usedRange, parseAddress, parseRange, styleAt, rangesIntersect, chartColorScheme, coloredReferences, syntaxParams, activeParam, columnLabel, THEME_SLOTS, normalizeRange, currentRegion, autoFitColumnWidth, validateSheetName, dateToSerial, IMAGE_EXTENSIONS, verifySheetPassword, verifyWorkbookPassword, sheetByName, quoteSheetName, pivotSourceData, printTitles, formatPrintTitleSpan, parsePrintTitleSpan, pivotPageItems, pivotPageItemLabel, serialToDate, BUILTIN_NUMBER_FORMATS, pixelsToColumnWidth, validateTableName } from 'ooxml-core/xlsx';
 import { hyperlinkPolicy } from 'ooxml-core/opc';
@@ -22,7 +23,7 @@ import { RECT_GRADIENT_DIRECTIONS, OFFICE_GRADIENT_PRESETS, officeGradientPreset
 import { applyResize, applyDragDelta } from 'ooxml-core/geometry';
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/xlsx/theme/shell.css?raw
-var shell_default = "/* Frame, title bar and status bar. Mirrors docx-viewer's chrome (styles/base.css,\n   chrome-titlebar.css, status-dialogs.css) with --xve-* tokens. */\n:host {\n	--xl: var(--xve-primary);\n	--xl-strong: color-mix(in srgb, var(--xve-primary) 70%, #000);\n	--xl-soft: color-mix(in srgb, var(--xve-primary) 12%, transparent);\n	--accent-soft: var(--xl-soft);\n	--ink: var(--xve-foreground);\n	--muted: var(--xve-muted-foreground);\n	--line: var(--xve-border);\n	--surface: var(--xve-card);\n	--chrome: var(--xve-background);\n	display: block;\n	box-sizing: border-box;\n	width: 100%;\n	height: 100%;\n	min-height: 0;\n	color: var(--ink);\n	font:\n		13px/1.35 'Segoe UI',\n		Arial,\n		sans-serif;\n}\n.xve-frame {\n	position: relative;\n	display: flex;\n	box-sizing: border-box;\n	width: 100%;\n	height: 100%;\n	min-height: 0;\n	min-width: 0;\n	flex-direction: column;\n	overflow: hidden;\n	background: var(--surface);\n}\n:focus-visible {\n	outline: 2px solid var(--xve-ring);\n	outline-offset: 1px;\n}\n[hidden],\n[data-xve-hidden] {\n	display: none !important;\n}\n.xve-icon {\n	flex: none;\n}\n.xve-icon-button {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	min-width: 28px;\n	height: 28px;\n	padding: 0 6px;\n	border: 0;\n	border-radius: 4px;\n	background: none;\n	color: inherit;\n	font: inherit;\n	cursor: pointer;\n}\n.xve-icon-button:hover:not(:disabled),\n.xve-icon-button[aria-pressed='true'] {\n	background: var(--xl-soft);\n}\n.xve-icon-button:disabled {\n	opacity: 0.4;\n	cursor: default;\n}\n\n/* Workspace: formula bar, grid and sheet tabs between the ribbon and the status bar. */\n.xve-workspace {\n	position: relative;\n	display: flex;\n	flex: 1;\n	min-height: 0;\n	min-width: 0;\n	flex-direction: column;\n	background: var(--xve-sheet-bg);\n}\n.xve-formula-row {\n	flex: none;\n	min-width: 0;\n	border-bottom: 1px solid var(--line);\n	background: var(--surface);\n}\n.xve-grid-host {\n	position: relative;\n	display: flex;\n	flex: 1;\n	min-height: 0;\n	min-width: 0;\n	overflow: hidden;\n	background: var(--xve-sheet-bg);\n	color-scheme: light;\n}\n.xve-grid-host > * {\n	flex: 1;\n	min-width: 0;\n}\n.xve-tabs-row {\n	flex: none;\n	min-width: 0;\n	border-top: 1px solid var(--line);\n	background: var(--chrome);\n}\n.xve-empty {\n	position: absolute;\n	z-index: 5;\n	inset: 0;\n	display: grid;\n	place-items: center;\n	color: var(--muted);\n	background: var(--chrome);\n}\n:host([show-formula-bar='false']) .xve-formula-row,\n:host([show-toolbar='false']) .xve-ribbon {\n	display: none;\n}\n\n/* Title bar: drawn by the shared office-ui-title-bar; the mark, background and borders come from its tokens. */\n.xve-titlebar {\n	display: block;\n	flex: none;\n	--office-title-bar-background: var(--chrome);\n	--office-title-bar-foreground: var(--ink);\n	--office-title-bar-border: var(--line);\n	--office-title-bar-mark-background: var(--xl);\n	--office-title-bar-mark-foreground: var(--xve-primary-foreground);\n}\n\n/* Status bar: drawn by the shared office-ui-status-bar; this places it and styles the slotted stats. */\n.xve-status {\n	display: block;\n	flex: none;\n	min-width: 0;\n	border-top: 1px solid var(--line);\n}\n.xve-status-stats {\n	margin-inline-end: 10px;\n	overflow: hidden;\n	color: var(--ink);\n	font-size: 11px;\n	white-space: nowrap;\n}\n\n@media (max-width: 760px) {\n	.xve-status-stats {\n		display: none;\n	}\n}\n";
+var shell_default = "/* Frame, title bar and status bar. Mirrors docx-viewer's chrome (styles/base.css,\n   chrome-titlebar.css, status-dialogs.css) with --xve-* tokens. */\n:host {\n	--xl: var(--xve-primary);\n	--xl-strong: color-mix(in srgb, var(--xve-primary) 70%, #000);\n	--xl-soft: color-mix(in srgb, var(--xve-primary) 12%, transparent);\n	--accent-soft: var(--xl-soft);\n	--ink: var(--xve-foreground);\n	--muted: var(--xve-muted-foreground);\n	--line: var(--xve-border);\n	--surface: var(--xve-card);\n	--chrome: var(--xve-background);\n	display: block;\n	box-sizing: border-box;\n	width: 100%;\n	height: 100%;\n	min-height: 0;\n	color: var(--ink);\n	font:\n		13px/1.35 'Segoe UI',\n		Arial,\n		sans-serif;\n}\n.xve-frame {\n	position: relative;\n	display: flex;\n	box-sizing: border-box;\n	width: 100%;\n	height: 100%;\n	min-height: 0;\n	min-width: 0;\n	flex-direction: column;\n	overflow: hidden;\n	background: var(--surface);\n}\n:focus-visible {\n	outline: 2px solid var(--xve-ring);\n	outline-offset: 1px;\n}\n[hidden],\n[data-xve-hidden] {\n	display: none !important;\n}\n.xve-icon {\n	flex: none;\n}\n.xve-icon-button {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	min-width: 28px;\n	height: 28px;\n	padding: 0 6px;\n	border: 0;\n	border-radius: 4px;\n	background: none;\n	color: inherit;\n	font: inherit;\n	cursor: pointer;\n}\n.xve-icon-button:hover:not(:disabled),\n.xve-icon-button[aria-pressed='true'] {\n	background: var(--xl-soft);\n}\n.xve-icon-button:disabled {\n	opacity: 0.4;\n	cursor: default;\n}\n\n/* Workspace: formula bar, grid and sheet tabs between the ribbon and the status bar. */\n.xve-workspace {\n	position: relative;\n	display: flex;\n	flex: 1;\n	min-height: 0;\n	min-width: 0;\n	flex-direction: column;\n	background: var(--xve-sheet-bg);\n}\n.xve-formula-row {\n	flex: none;\n	min-width: 0;\n	border-bottom: 1px solid var(--line);\n	background: var(--surface);\n}\n.xve-grid-host {\n	position: relative;\n	display: flex;\n	flex: 1;\n	min-height: 0;\n	min-width: 0;\n	overflow: hidden;\n	background: var(--xve-sheet-bg);\n	color-scheme: light;\n}\n.xve-grid-host > * {\n	flex: 1;\n	min-width: 0;\n}\n.xve-tabs-row {\n	flex: none;\n	min-width: 0;\n	border-top: 1px solid var(--line);\n	background: var(--chrome);\n}\n.xve-empty {\n	position: absolute;\n	z-index: 5;\n	inset: 0;\n	display: grid;\n	place-items: center;\n	color: var(--muted);\n	background: var(--chrome);\n}\n:host([show-formula-bar='false']) .xve-formula-row,\n:host([show-toolbar='false']) .xve-ribbon {\n	display: none;\n}\n\n/* Title bar: drawn by the shared office-ui-title-bar; the mark, background and borders come from its tokens. */\n.xve-titlebar {\n	display: block;\n	flex: none;\n	--office-title-bar-background: var(--chrome);\n	--office-title-bar-foreground: var(--ink);\n	--office-title-bar-border: var(--line);\n	--office-title-bar-mark-background: var(--xl);\n	--office-title-bar-mark-foreground: var(--xve-primary-foreground);\n}\n\n/* Status bar: drawn by the shared office-ui-status-bar; this places it and styles the slotted stats. */\n.xve-status {\n	display: block;\n	flex: none;\n	min-width: 0;\n	border-top: 1px solid var(--line);\n}\n.xve-status-stats {\n	margin-inline-end: 10px;\n	min-width: 0;\n	overflow: hidden;\n	color: var(--ink);\n	font-size: 11px;\n	text-overflow: ellipsis;\n	white-space: nowrap;\n}\n";
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/xlsx/theme/ribbon.css?raw
 var ribbon_default = "/* Ribbon: tabs, panels, groups and controls. Mirrors docx-viewer's styles/ribbon*.css. */\n.xve-ribbon-gallery[data-office-gallery] .trigger {\n	flex-direction: column;\n	justify-content: center;\n	min-width: 56px;\n	height: 78px;\n	white-space: normal;\n	text-align: center;\n}\n.xve-ribbon-gallery[data-office-gallery] .trigger > svg {\n	width: 28px;\n	height: 28px;\n}\n.xve-ribbon-gallery[data-office-gallery] .trigger > span:not([aria-hidden]) {\n	max-width: 56px;\n}\n.xve-ribbon {\n	position: relative;\n	display: flex;\n	flex: none;\n	min-width: 0;\n	flex-direction: column;\n	background: var(--surface);\n	border-bottom: 1px solid var(--line);\n}\n/* The tab row, File button and collapse button are the shared office-ui-ribbon; these colour it. */\n.xve-ribbon {\n	--office-ribbon-contextual: #0f7b6c;\n}\n.xve-ribbon::part(file) {\n	font-weight: 600;\n}\n.ribbon-panel {\n	display: flex;\n	flex: none;\n	box-sizing: border-box;\n	height: 104px;\n	min-width: 0;\n	align-items: stretch;\n	gap: 4px;\n	padding: 6px 10px 4px;\n	overflow-x: auto;\n	overflow-y: hidden;\n	scrollbar-width: thin;\n}\n.ribbon-group {\n	position: relative;\n	display: flex;\n	flex: 0 0 auto;\n	align-items: flex-start;\n	min-width: 0;\n	gap: 2px;\n	padding: 2px 10px 18px 2px;\n	border-right: 1px solid var(--line);\n}\n.ribbon-group:last-child {\n	border: 0;\n}\n.ribbon-group::after {\n	position: absolute;\n	right: 0;\n	bottom: 2px;\n	left: 0;\n	color: var(--muted);\n	font-size: 10px;\n	line-height: 1.1;\n	text-align: center;\n	white-space: nowrap;\n	content: attr(data-caption);\n}\n.ribbon-caption-sizer {\n	position: absolute;\n	visibility: hidden;\n	font-size: 10px;\n	white-space: nowrap;\n}\n.ribbon-stack {\n	display: flex;\n	flex-direction: column;\n	align-items: flex-start;\n	gap: 2px;\n}\n.ribbon-stack > .ribbon-stack {\n	flex-direction: row;\n	align-items: center;\n}\n.ribbon-separator {\n	align-self: stretch;\n	width: 1px;\n	margin: 2px 3px;\n	background: var(--line);\n}\n.ribbon-stack > .ribbon-separator {\n	width: auto;\n	height: 1px;\n}\n.ribbon-stack > .ribbon-stack > .ribbon-separator {\n	width: 1px;\n	height: 20px;\n}\n\n/* Buttons */\n.ribbon-group button {\n	flex: none;\n	min-width: 28px;\n	height: 28px;\n	max-width: 100%;\n	padding: 0 4px;\n	overflow: hidden;\n	border: 1px solid transparent;\n	border-radius: 4px;\n	background: transparent;\n	color: var(--ink);\n	font:\n		400 12px 'Segoe UI',\n		Arial,\n		sans-serif;\n	text-overflow: ellipsis;\n	white-space: nowrap;\n	cursor: pointer;\n}\n.ribbon-group button:hover:not(:disabled) {\n	border-color: var(--line);\n	background: var(--accent-soft);\n}\n.ribbon-group button[aria-pressed='true'],\n.ribbon-group button[aria-expanded='true'] {\n	border-color: color-mix(in srgb, var(--xl) 45%, transparent);\n	background: color-mix(in srgb, var(--xl) 20%, transparent);\n}\n.ribbon-group button:active:not(:disabled) {\n	background: color-mix(in srgb, var(--xl) 28%, transparent);\n}\n.ribbon-group button:focus-visible {\n	outline: 2px solid var(--xl);\n	outline-offset: -2px;\n}\n.ribbon-group button:disabled,\n.ribbon-group input:disabled {\n	opacity: 0.4;\n	cursor: default;\n}\n.ribbon-group button.ribbon-small {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	gap: 4px;\n	height: 24px;\n	padding: 0 3px;\n}\n.ribbon-group button.ribbon-small.ribbon-labelled {\n	justify-content: flex-start;\n	padding: 0 6px 0 4px;\n}\n.ribbon-group button.ribbon-large {\n	display: flex;\n	flex-direction: column;\n	align-items: center;\n	justify-content: flex-start;\n	gap: 2px;\n	width: auto;\n	min-width: 48px;\n	height: 76px;\n	padding: 3px 3px 2px;\n	font-size: 11px;\n	line-height: 1.15;\n	white-space: normal;\n	text-align: center;\n}\n.ribbon-large > .ribbon-icon:last-child:not(:first-child) {\n	margin-top: auto;\n}\n.ribbon-large > span,\n.ribbon-caption {\n	/* Two balanced lines (see ribbon/caption.ts); the button grows to the widest. */\n	white-space: pre;\n}\n.ribbon-icon {\n	flex: none;\n}\n.ribbon-icon[data-icon$='-caret'],\n.ribbon-icon[data-icon='caret'] {\n	opacity: 0.8;\n}\n\n/* Split buttons: a main half and a caret that opens a menu or the colour grid. */\n.ribbon-split {\n	display: inline-flex;\n	align-items: stretch;\n}\n.ribbon-split.ribbon-split-large {\n	flex-direction: column;\n}\n.ribbon-group .ribbon-split > button:first-child {\n	border-top-right-radius: 0;\n	border-bottom-right-radius: 0;\n}\n.ribbon-group .ribbon-split > .ribbon-caret {\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	width: 14px;\n	min-width: 14px;\n	padding: 0;\n	border-top-left-radius: 0;\n	border-bottom-left-radius: 0;\n}\n.ribbon-group .ribbon-split-large > button:first-child {\n	height: 46px;\n	border-radius: 4px 4px 0 0;\n}\n.ribbon-group .ribbon-split-large > .ribbon-caret {\n	width: auto;\n	height: 26px;\n	border-radius: 0 0 4px 4px;\n	font-size: 11px;\n	flex-direction: column;\n	gap: 0;\n}\n.ribbon-color {\n	position: relative;\n}\n.ribbon-group button.ribbon-color::after {\n	position: absolute;\n	right: 4px;\n	bottom: 2px;\n	left: 4px;\n	height: 3px;\n	background: var(--bar, transparent);\n	outline: 1px solid var(--line);\n	content: '';\n}\n\n/* Editable combo boxes (font name and size) and plain selects. */\n.ribbon-combo {\n	display: inline-flex;\n	align-items: stretch;\n	height: 24px;\n	border: 1px solid var(--line);\n	border-radius: 3px;\n	background: var(--surface);\n}\n.ribbon-combo:focus-within {\n	border-color: var(--xl);\n	outline: 1px solid var(--xl);\n}\n.ribbon-combo input {\n	flex: 1;\n	min-width: 0;\n	padding: 0 6px;\n	border: 0;\n	background: transparent;\n	color: var(--ink);\n	font:\n		12px 'Segoe UI',\n		Arial,\n		sans-serif;\n	outline: none;\n}\n.ribbon-group .ribbon-combo .ribbon-caret {\n	width: 18px;\n	min-width: 18px;\n	height: 100%;\n	padding: 0;\n	border: 0;\n	border-radius: 0;\n}\n\n/* Plain drop-downs (Number Format) and gallery previews. */\n.ribbon-group select.ribbon-select {\n	height: 24px;\n	padding: 0 6px;\n	border: 1px solid var(--line);\n	border-radius: 3px;\n	background: var(--surface);\n	color: var(--ink);\n	font:\n		12px 'Segoe UI',\n		Arial,\n		sans-serif;\n	text-overflow: ellipsis;\n}\n.ribbon-group select.ribbon-select:focus-visible {\n	outline: 2px solid var(--xl);\n	outline-offset: -1px;\n}\n.ribbon-gallery-preview {\n	display: block;\n	height: 36px;\n	margin-bottom: 3px;\n	border: 1px solid var(--line);\n	border-radius: 2px;\n	background: #fff;\n	color: #1f1f1f;\n	font-size: 11px;\n	line-height: 36px;\n	text-align: center;\n	overflow: hidden;\n	white-space: nowrap;\n	text-overflow: ellipsis;\n}\n.ribbon-gallery-preview > svg {\n	display: block;\n	width: 100%;\n	height: 100%;\n}\n\n/* Dialog launcher: the corner arrow of a group. */\n.ribbon-group button.ribbon-launcher {\n	position: absolute;\n	right: 2px;\n	bottom: 0;\n	z-index: 1;\n	display: inline-flex;\n	align-items: center;\n	justify-content: center;\n	width: 14px;\n	min-width: 14px;\n	height: 14px;\n	padding: 0;\n	color: var(--muted);\n}\n\n/* Collapsed groups: a narrow ribbon folds its rightmost groups into one dropdown each. */\n.ribbon-group > .ribbon-overflow-button {\n	display: none;\n}\n.ribbon-group[data-collapsed] {\n	padding-right: 4px;\n}\n.ribbon-group[data-collapsed] > :not(.ribbon-overflow-button) {\n	display: none !important;\n}\n.ribbon-group[data-collapsed] > button.ribbon-overflow-button {\n	display: flex;\n}\n.ribbon-group[data-collapsed]::after {\n	display: none;\n}\n.ribbon-overflow-panel .ribbon-group {\n	height: 84px;\n	padding-right: 2px;\n	border: 0;\n}\n\n/* KeyTips */\n.xve-keytip {\n	position: absolute;\n	bottom: -2px;\n	left: 50%;\n	z-index: 70;\n	min-width: 16px;\n	padding: 1px 4px;\n	border: 1px solid var(--line);\n	border-radius: 3px;\n	background: #1f1f1f;\n	color: #fff;\n	font:\n		600 11px/14px 'Segoe UI',\n		Arial,\n		sans-serif;\n	text-align: center;\n	pointer-events: none;\n	transform: translateX(-50%);\n}\n.xve-keytip-command {\n	position: fixed;\n	bottom: auto;\n}\n\n/* Accent hues on command icons, as in Office. */\n:host {\n	--ribbon-accent-blue: #2b7cd3;\n	--ribbon-accent-green: #2f9e5f;\n	--ribbon-accent-red: #d13438;\n	--ribbon-accent-orange: #d9822b;\n}\n@media (prefers-color-scheme: dark) {\n	:host(:not([theme='light'])) {\n		--ribbon-accent-blue: #5ea5f0;\n		--ribbon-accent-green: #5cc98a;\n		--ribbon-accent-red: #f07a7d;\n		--ribbon-accent-orange: #f0a35e;\n	}\n}\n:host([theme='dark']) {\n	--ribbon-accent-blue: #5ea5f0;\n	--ribbon-accent-green: #5cc98a;\n	--ribbon-accent-red: #f07a7d;\n	--ribbon-accent-orange: #f0a35e;\n}\n.ribbon-icon[data-accent='blue'] {\n	color: var(--ribbon-accent-blue);\n}\n.ribbon-icon[data-accent='green'] {\n	color: var(--ribbon-accent-green);\n}\n.ribbon-icon[data-accent='red'] {\n	color: var(--ribbon-accent-red);\n}\n.ribbon-icon[data-accent='orange'] {\n	color: var(--ribbon-accent-orange);\n}\n";
@@ -34,7 +35,7 @@ var ribbon_parity_default = ".xve-cell-styles[mode='inline'] .strip {\n	display:
 var popups_default = "/* Floating surfaces: ribbon popovers, menus, the colour grid, Tell me, toasts and the shell dialogs. */\n.ribbon-popover {\n	position: fixed;\n	z-index: 1000;\n	box-sizing: border-box;\n	padding: 4px;\n	border: 1px solid var(--line);\n	border-radius: 6px;\n	background: var(--xve-popover);\n	box-shadow: 0 6px 20px rgb(0 0 0 / 0.18);\n	color: var(--xve-popover-foreground);\n	font:\n		12px 'Segoe UI',\n		Arial,\n		sans-serif;\n}\n.ribbon-popover.ribbon-menu-list,\n.ribbon-popover.ribbon-list {\n	display: flex;\n	min-width: 180px;\n	max-height: min(70vh, 420px);\n	flex-direction: column;\n	overflow-y: auto;\n}\n.ribbon-menu-list [role='menuitem'],\n.ribbon-menu-list [role='menuitemcheckbox'],\n.ribbon-list [role='option'] {\n	display: flex;\n	align-items: center;\n	gap: 10px;\n	width: 100%;\n	padding: 5px 12px 5px 8px;\n	border: 0;\n	border-radius: 3px;\n	background: none;\n	color: inherit;\n	font: inherit;\n	text-align: left;\n	white-space: nowrap;\n	cursor: pointer;\n}\n.ribbon-menu-list [role^='menuitem']:hover:not(:disabled),\n.ribbon-menu-list [role^='menuitem']:focus-visible,\n.ribbon-list [role='option']:hover,\n.ribbon-list [role='option']:focus-visible {\n	background: var(--accent-soft);\n	outline: none;\n}\n.ribbon-menu-list [role^='menuitem']:disabled {\n	opacity: 0.45;\n	cursor: default;\n}\n.ribbon-menu-list [aria-checked='true'] {\n	font-weight: 600;\n}\n.ribbon-menu-list .ribbon-menu-icon {\n	display: inline-flex;\n	width: 16px;\n}\n.ribbon-menu-list .ribbon-menu-shortcut {\n	margin-left: auto;\n	padding-left: 18px;\n	color: var(--muted);\n}\n.ribbon-menu-list [role='separator'] {\n	height: 1px;\n	margin: 4px 2px;\n	background: var(--line);\n}\n.ribbon-list [aria-selected='true'] {\n	color: var(--xl);\n	font-weight: 600;\n}\n.ribbon-popover.ribbon-gallery-menu {\n	display: grid;\n	grid-template-columns: repeat(4, 96px);\n	gap: 4px;\n	max-height: min(70vh, 420px);\n	overflow-y: auto;\n}\n.ribbon-gallery-menu button {\n	padding: 4px;\n	border: 1px solid transparent;\n	border-radius: 3px;\n	background: none;\n	color: inherit;\n	font: inherit;\n	cursor: pointer;\n}\n.ribbon-gallery-menu button:hover,\n.ribbon-gallery-menu button:focus-visible {\n	border-color: var(--line);\n	background: var(--accent-soft);\n	outline: none;\n}\n\n/* Colour picker: the shared office-ui-color-grid in a ribbon popover. */\n.ribbon-popover.color-grid {\n	display: block;\n	padding: 4px;\n}\n.color-grid-input {\n	position: absolute;\n	width: 0;\n	height: 0;\n	padding: 0;\n	border: 0;\n	opacity: 0;\n	pointer-events: none;\n}\n\n/* Toasts */\n.xve-toasts {\n	position: absolute;\n	z-index: 90;\n	right: 16px;\n	bottom: 40px;\n	display: flex;\n	max-width: min(420px, calc(100% - 32px));\n	flex-direction: column;\n	gap: 8px;\n	pointer-events: none;\n}\n.xve-toast {\n	display: flex;\n	align-items: flex-start;\n	gap: 8px;\n	padding: 10px 12px;\n	border: 1px solid var(--line);\n	border-left: 4px solid var(--xl);\n	border-radius: 6px;\n	background: var(--xve-popover);\n	box-shadow: 0 8px 24px #0003;\n	color: var(--xve-popover-foreground);\n	pointer-events: auto;\n}\n.xve-toast[data-kind='warning'] {\n	border-left-color: #b7791f;\n}\n.xve-toast[data-kind='error'] {\n	border-left-color: var(--xve-destructive);\n}\n.xve-toast-text {\n	flex: 1;\n}\n\n/* Shell dialogs (shortcut help, prompts) */\n.xve-dialog {\n	position: absolute;\n	z-index: 85;\n	top: 120px;\n	left: 50%;\n	display: grid;\n	box-sizing: border-box;\n	width: min(440px, calc(100% - 32px));\n	gap: 10px;\n	padding: 18px 20px;\n	border: 1px solid var(--line);\n	border-radius: 8px;\n	background: var(--xve-popover);\n	box-shadow: 0 12px 32px #0003;\n	color: var(--ink);\n	transform: translateX(-50%);\n}\n.xve-dialog h2 {\n	margin: 0 0 4px;\n	font-size: 16px;\n	font-weight: 600;\n}\n.xve-dialog-actions {\n	display: flex;\n	justify-content: flex-end;\n	gap: 8px;\n	margin-top: 6px;\n}\n.xve-dialog-actions button {\n	min-height: 30px;\n	padding: 0 14px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n	background: var(--surface);\n	color: var(--ink);\n	font: inherit;\n	cursor: pointer;\n}\n.xve-dialog-actions .xve-dialog-primary {\n	border-color: var(--xl);\n	background: var(--xl);\n	color: var(--xve-primary-foreground);\n}\n.xve-shortcut-help {\n	width: min(620px, calc(100% - 32px));\n	max-height: calc(100% - 160px);\n	overflow: auto;\n}\n.xve-shortcut-help p {\n	margin: 0;\n	color: var(--muted);\n	font-size: 12px;\n}\n.xve-shortcut-help table {\n	width: 100%;\n	border-collapse: collapse;\n}\n.xve-shortcut-help th,\n.xve-shortcut-help td {\n	padding: 5px 8px;\n	border-bottom: 1px solid var(--line);\n	text-align: left;\n	vertical-align: top;\n}\n.xve-shortcut-help th {\n	color: var(--muted);\n	font-size: 12px;\n	font-weight: 600;\n}\n.xve-shortcut-help kbd {\n	padding: 1px 6px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n	background: var(--surface);\n	font:\n		12px/1.4 ui-monospace,\n		Consolas,\n		monospace;\n	white-space: nowrap;\n}\n";
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/xlsx/theme/backstage.css?raw
-var backstage_default = "/* File backstage: the shared office-ui-backstage draws the navigation; these style the page content.\n   The nav colours come from its tokens. */\n.xve-backstage {\n	z-index: 40;\n	--office-background: var(--surface);\n	--office-backstage-nav-background: var(--xl);\n	--office-backstage-nav-foreground: var(--xve-primary-foreground);\n}\n.xve-backstage-content {\n	overflow: auto;\n	padding: 28px 40px;\n	color: var(--ink);\n}\n.xve-backstage-content h2 {\n	margin: 0 0 20px;\n	font-size: 30px;\n	font-weight: 300;\n}\n.xve-backstage-content h3 {\n	margin: 24px 0 10px;\n	font-size: 15px;\n	font-weight: 600;\n}\n.xve-backstage-title {\n	margin: 0 0 4px;\n	font-size: 26px;\n	font-weight: 400;\n	overflow-wrap: anywhere;\n}\n.xve-backstage-muted {\n	color: var(--muted);\n}\n.xve-backstage-facts {\n	display: grid;\n	grid-template-columns: max-content minmax(0, 1fr);\n	gap: 6px 24px;\n	margin: 0;\n}\n.xve-backstage-facts dt {\n	color: var(--muted);\n}\n.xve-backstage-facts dd {\n	margin: 0;\n	overflow-wrap: anywhere;\n}\n.xve-compatibility-notes {\n	display: grid;\n	gap: 8px;\n	max-width: 760px;\n	margin: 0;\n	padding: 0;\n	list-style: none;\n}\n.xve-compatibility-notes li {\n	display: flex;\n	gap: 8px;\n	padding: 10px 12px;\n	border: 1px solid var(--line);\n	border-radius: 6px;\n	line-height: 1.45;\n}\n.xve-compatibility-notes .xve-icon {\n	margin-top: 2px;\n	color: #b7791f;\n}\n.xve-backstage-columns {\n	display: grid;\n	grid-template-columns: minmax(0, 1fr) 300px;\n	gap: 40px;\n	align-items: start;\n}\n.xve-backstage-properties {\n	padding: 4px 0 0 24px;\n	border-left: 1px solid var(--line);\n}\n.xve-backstage-properties h3 {\n	margin-top: 0;\n}\n.xve-backstage-tiles {\n	display: flex;\n	flex-wrap: wrap;\n	gap: 12px;\n}\n.xve-backstage-tile {\n	display: inline-flex;\n	flex-direction: column;\n	gap: 8px;\n	padding: 8px;\n	border: 1px solid transparent;\n	border-radius: 6px;\n	background: none;\n	color: var(--ink);\n	font: inherit;\n	cursor: pointer;\n}\n.xve-backstage-tile:hover {\n	border-color: var(--line);\n	background: var(--xl-soft);\n}\n.xve-backstage-tile-preview {\n	display: block;\n	width: 150px;\n	height: 112px;\n	border: 1px solid var(--line);\n	background-color: #fff;\n	background-image:\n		linear-gradient(#e1e1e1 1px, transparent 1px),\n		linear-gradient(90deg, #e1e1e1 1px, transparent 1px);\n	background-size: 30px 14px;\n	box-shadow: 0 1px 3px #0002;\n}\n.xve-backstage-tile-preview[data-template]::before {\n	display: block;\n	height: 14px;\n	background: var(--xl);\n	content: '';\n	opacity: 0.85;\n}\n.xve-backstage-card {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	gap: 24px;\n	max-width: 760px;\n	margin-bottom: 12px;\n	padding: 14px 18px;\n	border: 1px solid var(--line);\n	border-radius: 6px;\n}\n.xve-backstage-card h3 {\n	margin: 0 0 4px;\n}\n.xve-backstage-card p {\n	margin: 0;\n}\n.xve-backstage-primary {\n	padding: 8px 18px;\n	border: 0;\n	border-radius: 4px;\n	background: var(--xl);\n	color: var(--xve-primary-foreground);\n	font: inherit;\n	cursor: pointer;\n	white-space: nowrap;\n}\n.xve-backstage-field {\n	display: grid;\n	gap: 4px;\n	max-width: 420px;\n	margin-bottom: 14px;\n	color: var(--muted);\n	font-size: 12px;\n}\n.xve-backstage-field input,\n.xve-backstage-field select {\n	height: 32px;\n	padding: 0 8px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n	background: var(--surface);\n	color: var(--ink);\n	font:\n		14px 'Segoe UI',\n		Arial,\n		sans-serif;\n}\n.xve-backstage-check {\n	display: flex;\n	align-items: center;\n	gap: 8px;\n	margin-bottom: 10px;\n}\n.xve-customize-group {\n	margin: 0 0 8px;\n	padding: 6px 10px 8px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n}\n.xve-customize-group legend {\n	padding: 0 4px;\n	color: var(--muted);\n	font-size: 12px;\n}\n.xve-customize-row {\n	display: inline-flex;\n	align-items: center;\n	gap: 6px;\n	min-width: 180px;\n	padding: 2px 8px 2px 0;\n	font-size: 13px;\n}\n@media (max-width: 760px) {\n	.xve-backstage-content {\n		padding: 20px;\n	}\n	.xve-backstage-columns {\n		grid-template-columns: minmax(0, 1fr);\n	}\n	.xve-backstage-properties {\n		padding-left: 0;\n		border-left: 0;\n	}\n}\n";
+var backstage_default = "/* File backstage: the shared office-ui-backstage draws the navigation; these style the page content.\n   The nav colours come from its tokens. */\n.xve-backstage {\n	z-index: 40;\n	--office-background: var(--surface);\n	--office-backstage-nav-background: var(--xl);\n	--office-backstage-nav-foreground: var(--xve-primary-foreground);\n}\n.xve-backstage-content {\n	overflow: auto;\n	padding: 28px 40px;\n	color: var(--ink);\n}\n.xve-backstage-content h2 {\n	margin: 0 0 20px;\n	font-size: 30px;\n	font-weight: 300;\n}\n.xve-backstage-content h3 {\n	margin: 24px 0 10px;\n	font-size: 15px;\n	font-weight: 600;\n}\n.xve-backstage-title {\n	margin: 0 0 4px;\n	font-size: 26px;\n	font-weight: 400;\n	overflow-wrap: anywhere;\n}\n.xve-backstage-muted {\n	color: var(--muted);\n}\n.xve-backstage-facts {\n	display: grid;\n	grid-template-columns: max-content minmax(0, 1fr);\n	gap: 6px 24px;\n	margin: 0;\n}\n.xve-backstage-facts dt {\n	color: var(--muted);\n}\n.xve-backstage-facts dd {\n	margin: 0;\n	overflow-wrap: anywhere;\n}\n.xve-compatibility-notes {\n	display: grid;\n	gap: 8px;\n	max-width: 760px;\n	margin: 0;\n	padding: 0;\n	list-style: none;\n}\n.xve-compatibility-notes li {\n	display: flex;\n	gap: 8px;\n	padding: 10px 12px;\n	border: 1px solid var(--line);\n	border-radius: 6px;\n	line-height: 1.45;\n}\n.xve-compatibility-notes .xve-icon {\n	margin-top: 2px;\n	color: #b7791f;\n}\n.xve-backstage-columns {\n	display: grid;\n	grid-template-columns: minmax(0, 1fr) 300px;\n	gap: 40px;\n	align-items: start;\n}\n.xve-backstage-properties {\n	padding: 4px 0 0 24px;\n	border-left: 1px solid var(--line);\n}\n.xve-backstage-properties h3 {\n	margin-top: 0;\n}\n.xve-backstage-tiles {\n	display: flex;\n	flex-wrap: wrap;\n	gap: 12px;\n}\n.xve-backstage-tile {\n	display: inline-flex;\n	flex-direction: column;\n	gap: 8px;\n	padding: 8px;\n	border: 1px solid transparent;\n	border-radius: 6px;\n	background: none;\n	color: var(--ink);\n	font: inherit;\n	cursor: pointer;\n}\n.xve-backstage-tile:hover {\n	border-color: var(--line);\n	background: var(--xl-soft);\n}\n.xve-backstage-tile-preview {\n	display: block;\n	width: 150px;\n	height: 112px;\n	border: 1px solid var(--line);\n	background-color: #fff;\n	background-image:\n		linear-gradient(#e1e1e1 1px, transparent 1px),\n		linear-gradient(90deg, #e1e1e1 1px, transparent 1px);\n	background-size: 30px 14px;\n	box-shadow: 0 1px 3px #0002;\n}\n.xve-backstage-tile-preview[data-template]::before {\n	display: block;\n	height: 14px;\n	background: var(--xl);\n	content: '';\n	opacity: 0.85;\n}\n.xve-backstage-card {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	gap: 24px;\n	max-width: 760px;\n	margin-bottom: 12px;\n	padding: 14px 18px;\n	border: 1px solid var(--line);\n	border-radius: 6px;\n}\n.xve-backstage-card h3 {\n	margin: 0 0 4px;\n}\n.xve-backstage-card p {\n	margin: 0;\n}\n.xve-backstage-primary {\n	padding: 8px 18px;\n	border: 0;\n	border-radius: 4px;\n	background: var(--xl);\n	color: var(--xve-primary-foreground);\n	font: inherit;\n	cursor: pointer;\n	white-space: nowrap;\n}\n.xve-backstage-field {\n	display: grid;\n	gap: 4px;\n	max-width: 420px;\n	margin-bottom: 14px;\n	color: var(--muted);\n	font-size: 12px;\n}\n.xve-backstage-field input,\n.xve-backstage-field select {\n	height: 32px;\n	padding: 0 8px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n	background: var(--surface);\n	color: var(--ink);\n	font:\n		14px 'Segoe UI',\n		Arial,\n		sans-serif;\n}\n/* File > Options > Customize Ribbon, shown in the shared Options dialog. */\n.xve-options-note {\n	margin: 0 0 8px;\n	color: var(--muted);\n	font-size: 11px;\n}\n.xve-options-action {\n	margin: 0 0 8px;\n	padding: 6px 11px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n	background: transparent;\n	color: inherit;\n	font: inherit;\n	font-size: 12px;\n	cursor: pointer;\n}\n.xve-options h3 {\n	margin: 14px 0 4px;\n	padding-bottom: 2px;\n	border-bottom: 1px solid var(--line);\n	color: var(--muted);\n	font-size: 10px;\n	font-weight: 700;\n	letter-spacing: 0.04em;\n	text-transform: uppercase;\n}\n.xve-customize-group {\n	margin: 0 0 8px;\n	padding: 6px 10px 8px;\n	border: 1px solid var(--line);\n	border-radius: 4px;\n}\n.xve-customize-group legend {\n	padding: 0 4px;\n	color: var(--muted);\n	font-size: 11px;\n}\n.xve-customize-row {\n	display: inline-flex;\n	align-items: center;\n	gap: 6px;\n	min-width: 180px;\n	padding: 2px 8px 2px 0;\n	font-size: 12px;\n}\n@media (max-width: 760px) {\n	.xve-backstage-content {\n		padding: 20px;\n	}\n	.xve-backstage-columns {\n		grid-template-columns: minmax(0, 1fr);\n	}\n	.xve-backstage-properties {\n		padding-left: 0;\n		border-left: 0;\n	}\n}\n";
 
 // raw-css:/home/runner/work/ooxml/ooxml/src/ui/src/xlsx/theme/chart-series.css?raw
 var chart_series_default = ".xve-canvas-row {\n	display: flex;\n	flex: 1;\n	min-width: 0;\n	min-height: 0;\n}\n.xve-chart-series-pane {\n	box-sizing: border-box;\n	width: 300px;\n	max-width: 45%;\n	flex: none;\n	overflow: auto;\n	border-left: 1px solid var(--line);\n	background: var(--surface);\n}\n.xve-chart-series-header {\n	display: flex;\n	align-items: center;\n	justify-content: space-between;\n	padding: 12px 12px 12px 18px;\n	border-bottom: 1px solid var(--line);\n}\n.xve-chart-series-header h2 {\n	margin: 0;\n	font-size: 18px;\n	font-weight: 400;\n}\n.xve-chart-series-body,\n.xve-chart-series-pane > .xve-note {\n	margin: 0;\n	padding: 18px;\n}\n.xve-chart-series-body h3 {\n	margin: 0 0 20px;\n	font-size: 13px;\n	font-weight: 600;\n}\n.xve-chart-series-body .xve-field {\n	display: grid;\n	grid-template-columns: 1fr 70px 12px;\n	align-items: center;\n	gap: 6px;\n	margin: 14px 0;\n}\n.xve-chart-series-body .xve-input-number {\n	box-sizing: border-box;\n	width: 70px;\n	min-width: 0;\n}\n.xve-chart-series-range .office-range-control {\n	box-sizing: border-box;\n	width: 100%;\n	margin: 0 0 8px;\n}\n.xve-chart-series-fill {\n	margin-top: 20px;\n	padding-top: 18px;\n	border-top: 1px solid var(--line);\n}\n.xve-chart-series-body .xve-field:has(select),\n.xve-chart-series-body .xve-field:has(.xve-chart-series-color),\n.xve-chart-series-body .xve-field:has(office-ui-gallery) {\n	grid-template-columns: 1fr minmax(100px, 1fr);\n}\n.xve-chart-series-body office-ui-gallery .trigger {\n	box-sizing: border-box;\n	width: 100%;\n	white-space: normal;\n}\n.xve-chart-series-color {\n	height: 28px;\n	background: var(--series-fill);\n	border: 1px solid var(--line);\n	cursor: pointer;\n}\n.xve-chart-series-color:disabled {\n	opacity: 0.5;\n	cursor: default;\n}\n.xve-chart-series-gradient {\n	margin-top: 18px;\n}\n.xve-chart-gradient-buttons {\n	display: flex;\n	gap: 8px;\n	justify-content: flex-end;\n}\n.xve-chart-gradient-selector {\n	display: flex;\n	align-items: center;\n	gap: 8px;\n}\n.xve-chart-gradient-selector .office-gradient-stop-track {\n	flex: 1;\n	min-width: 0;\n}\n.xve-chart-gradient-buttons .xve-button {\n	width: 26px;\n	height: 28px;\n	padding: 0;\n	font-size: 18px;\n}\n";
@@ -719,122 +720,6 @@ function renderExport(page) {
     )
   );
 }
-var LANGUAGES = [
-  ["en", "English"],
-  ["fr", "Fran\xE7ais"],
-  ["de", "Deutsch"],
-  ["es", "Espa\xF1ol"],
-  ["zh-CN", "\u7B80\u4F53\u4E2D\u6587"]
-];
-var DEFAULT_ITERATIONS = 100;
-var DEFAULT_MAX_CHANGE = 1e-3;
-function iterationControls(page, current) {
-  const { t, host, doc } = page;
-  defineCheckbox(doc.defaultView?.customElements);
-  const toggle = doc.createElement("office-ui-checkbox");
-  toggle.setAttribute("aria-label", t("Enable iterative calculation"));
-  toggle.checked = Boolean(current);
-  const row2 = doc.createElement("div");
-  row2.className = "xve-backstage-check";
-  const text3 = doc.createElement("span");
-  text3.textContent = t("Enable iterative calculation");
-  row2.append(toggle, text3);
-  text3.addEventListener("click", () => toggle.click());
-  const number = (value, min, step2) => {
-    const input = doc.createElement("input");
-    input.type = "number";
-    input.min = String(min);
-    input.step = step2;
-    input.value = String(value);
-    input.disabled = !current;
-    return input;
-  };
-  const count = number(current?.count ?? DEFAULT_ITERATIONS, 1, "1");
-  const delta = number(current?.delta ?? DEFAULT_MAX_CHANGE, 0, "any");
-  const apply = () => {
-    count.disabled = delta.disabled = !toggle.checked;
-    host.setOption(
-      "iteration",
-      toggle.checked ? {
-        count: Number(count.value) || DEFAULT_ITERATIONS,
-        delta: delta.value === "" ? DEFAULT_MAX_CHANGE : Number(delta.value)
-      } : void 0
-    );
-  };
-  toggle.addEventListener("change", apply);
-  count.addEventListener("change", apply);
-  delta.addEventListener("change", apply);
-  return [
-    row2,
-    labelled(page, t("Maximum iterations"), count),
-    labelled(page, t("Maximum change"), delta),
-    paragraph(
-      page,
-      t(
-        "Circular references are recalculated up to the maximum iterations, stopping once no cell changes by more than the maximum change."
-      ),
-      "xve-backstage-muted"
-    )
-  ];
-}
-function renderOptions(page) {
-  const { t, host, doc } = page;
-  const current = host.options();
-  const language = doc.createElement("select");
-  for (const [value, label] of LANGUAGES) language.append(new Option(label, value));
-  language.value = current.locale;
-  language.addEventListener("change", () => host.setOption("locale", language.value));
-  const theme = doc.createElement("select");
-  for (const [value, label] of [
-    ["auto", "Automatic"],
-    ["light", "Light"],
-    ["dark", "Dark"]
-  ])
-    theme.append(new Option(t(label), value));
-  theme.value = current.theme === "light" || current.theme === "dark" ? current.theme : "auto";
-  theme.addEventListener("change", () => host.setOption("theme", theme.value));
-  const author = doc.createElement("input");
-  author.type = "text";
-  author.value = current.author;
-  author.addEventListener("change", () => host.setOption("author", author.value));
-  const calculation = doc.createElement("select");
-  calculation.append(new Option(t("Automatic"), "automatic"), new Option(t("Manual"), "manual"));
-  calculation.value = current.calculation;
-  calculation.addEventListener(
-    "change",
-    () => host.setOption("calculation", calculation.value === "manual" ? "manual" : "automatic")
-  );
-  const iteration = iterationControls(page, current.iteration);
-  const r1c1 = doc.createElement("label");
-  r1c1.className = "xve-backstage-check";
-  const box = doc.createElement("input");
-  box.type = "checkbox";
-  box.disabled = true;
-  const text3 = doc.createElement("span");
-  text3.textContent = t("R1C1 reference style (not available)");
-  r1c1.append(box, text3);
-  page.content.replaceChildren(
-    heading(page, t("Options")),
-    heading(page, t("General"), "h3"),
-    labelled(page, t("Display language"), language),
-    labelled(page, t("Theme"), theme),
-    labelled(page, t("Author name"), author),
-    heading(page, t("Formulas"), "h3"),
-    labelled(page, t("Workbook calculation"), calculation),
-    paragraph(
-      page,
-      t("Manual: formulas recalculate when you press F9 (Calculate Now)."),
-      "xve-backstage-muted"
-    ),
-    ...iteration,
-    r1c1,
-    paragraph(
-      page,
-      t("Options apply to this editor and are not stored between sessions."),
-      "xve-backstage-muted"
-    )
-  );
-}
 function commandsOf(control) {
   switch (control.kind) {
     case "stack":
@@ -852,9 +737,9 @@ function commandsOf(control) {
       return [control.command];
   }
 }
-function renderCustomize(page) {
-  const { t, host, doc } = page;
-  const { commands } = host.ctx;
+function renderCustomizeRibbon(pane, host) {
+  const { t, commands } = host.ctx;
+  const doc = pane.ownerDocument;
   const hidden = new Set(host.hiddenActions());
   const boxes = [];
   const commit = () => host.setHiddenActions(boxes.filter((box) => !box.input.checked).map((box) => box.id));
@@ -862,7 +747,9 @@ function renderCustomize(page) {
   const sections = [];
   for (const tab of ribbonTabs()) {
     const section = doc.createElement("section");
-    section.append(heading(page, t(tab.label), "h3"));
+    const title = doc.createElement("h3");
+    title.textContent = t(tab.label);
+    section.append(title);
     for (const group of tab.groups) {
       const fieldset2 = doc.createElement("fieldset");
       fieldset2.className = "xve-customize-group";
@@ -889,16 +776,234 @@ function renderCustomize(page) {
     }
     if (section.childElementCount > 1) sections.push(section);
   }
-  const reset = primary(page, t("Reset all customizations"), () => {
+  const note = doc.createElement("p");
+  note.className = "xve-options-note";
+  note.textContent = t("Choose which commands the ribbon shows.");
+  const reset = doc.createElement("button");
+  reset.type = "button";
+  reset.className = "xve-options-action";
+  reset.textContent = t("Reset all customizations");
+  reset.addEventListener("click", () => {
     for (const box of boxes) box.input.checked = true;
     commit();
   });
-  page.content.replaceChildren(
-    heading(page, t("Customize Ribbon")),
-    paragraph(page, t("Choose which commands the ribbon shows."), "xve-backstage-muted"),
-    reset,
-    ...sections
-  );
+  pane.replaceChildren(note, reset, ...sections);
+}
+
+// src/xlsx/backstage/options-dialog.ts
+var LANGUAGES = [
+  ["en", "English"],
+  ["fr", "Fran\xE7ais"],
+  ["de", "Deutsch"],
+  ["es", "Espa\xF1ol"],
+  ["zh-CN", "\u7B80\u4F53\u4E2D\u6587"]
+];
+var DEFAULT_ITERATIONS = 100;
+var DEFAULT_MAX_CHANGE = 1e-3;
+var DIRECT_KEYS = ["locale", "theme", "author", "calculation"];
+var ITERATION_KEYS = ["iterate", "iterationCount", "iterationDelta"];
+function excelCategories(context) {
+  const { t } = context;
+  return [
+    {
+      id: "general",
+      label: t("General"),
+      description: optionText(context, "General options for working with {product}."),
+      sections: [
+        userInterfaceSection(context),
+        personalizeSection(
+          context,
+          [
+            { kind: "text", key: "author", label: t("User name"), maxLength: 64 },
+            {
+              kind: "select",
+              key: "theme",
+              label: t("Office Theme"),
+              choices: [
+                { value: "auto", label: t("Automatic") },
+                { value: "light", label: t("Light") },
+                { value: "dark", label: t("Dark") }
+              ]
+            }
+          ],
+          t("Options apply to this editor and are not stored between sessions.")
+        )
+      ]
+    },
+    {
+      id: "formulas",
+      label: t("Formulas"),
+      description: t(
+        "Change options related to formula calculation, performance, and error handling."
+      ),
+      sections: [
+        {
+          id: "calculation",
+          title: t("Calculation options"),
+          controls: [
+            {
+              kind: "select",
+              key: "calculation",
+              label: t("Workbook calculation"),
+              info: t("Manual: formulas recalculate when you press F9 (Calculate Now)."),
+              choices: [
+                { value: "automatic", label: t("Automatic") },
+                { value: "manual", label: t("Manual") }
+              ]
+            },
+            {
+              kind: "toggle",
+              key: "iterate",
+              label: t("Enable iterative calculation"),
+              info: t(
+                "Circular references are recalculated up to the maximum iterations, stopping once no cell changes by more than the maximum change."
+              )
+            },
+            {
+              kind: "number",
+              key: "iterationCount",
+              label: t("Maximum iterations"),
+              min: 1,
+              max: 32767,
+              indent: true,
+              enabledBy: "iterate"
+            },
+            {
+              kind: "number",
+              key: "iterationDelta",
+              label: t("Maximum change"),
+              min: 0,
+              max: 1e3,
+              step: 1e-3,
+              indent: true,
+              enabledBy: "iterate"
+            }
+          ]
+        },
+        {
+          id: "working",
+          title: t("Working with formulas"),
+          controls: [
+            unavailableControl(
+              context,
+              { kind: "toggle", key: "r1c1", label: t("R1C1 reference style") },
+              "Not available yet. Only A1 references are supported."
+            )
+          ]
+        }
+      ]
+    },
+    {
+      id: "data",
+      label: t("Data"),
+      description: t("Change settings for importing and analyzing data."),
+      sections: [],
+      disabled: t("Not available yet. Data import and query settings are not supported.")
+    },
+    unavailableCategory(context, "proofing"),
+    unavailableCategory(context, "save"),
+    {
+      id: "language",
+      label: t("Language"),
+      description: t("Set the Office Language Preferences."),
+      sections: [
+        {
+          id: "display-language",
+          title: t("Office display language"),
+          description: t("Choose the language for menus, buttons and messages."),
+          controls: [
+            {
+              kind: "select",
+              key: "locale",
+              label: t("Display language"),
+              choices: LANGUAGES.map(([value, label]) => ({ value, label }))
+            }
+          ]
+        }
+      ]
+    },
+    unavailableCategory(context, "accessibility"),
+    unavailableCategory(context, "advanced"),
+    {
+      id: "ribbon",
+      label: t("Customize Ribbon"),
+      description: t("Customize the Ribbon and keyboard shortcuts."),
+      sections: [],
+      custom: true
+    },
+    unavailableCategory(context, "qat"),
+    unavailableCategory(context, "addins"),
+    unavailableCategory(context, "trust")
+  ];
+}
+function dialogValues(host) {
+  const current = host.options();
+  return {
+    locale: current.locale,
+    theme: current.theme === "light" || current.theme === "dark" ? current.theme : "auto",
+    author: current.author,
+    calculation: current.calculation,
+    iterate: Boolean(current.iteration),
+    iterationCount: current.iteration?.count ?? DEFAULT_ITERATIONS,
+    iterationDelta: current.iteration?.delta ?? DEFAULT_MAX_CHANGE
+  };
+}
+function iterationOf(values) {
+  if (values.iterate !== true) return void 0;
+  return {
+    count: Number(values.iterationCount) || DEFAULT_ITERATIONS,
+    delta: Number(values.iterationDelta)
+  };
+}
+function createExcelOptions(host) {
+  const { ctx } = host;
+  const doc = ctx.host.ownerDocument;
+  defineOptionsDialog();
+  const element = doc.createElement("office-ui-options-dialog");
+  element.className = "xve-options";
+  const ribbon = doc.createElement("div");
+  ribbon.slot = "pane-ribbon";
+  element.append(ribbon);
+  const context = { product: "Excel", t: (text3) => ctx.t(text3) };
+  let hiddenOnOpen = [];
+  const build = () => {
+    element.setAttribute("heading", ctx.t("Options"));
+    element.labels = optionsLabels(context);
+    element.categories = excelCategories(context);
+    element.values = dialogValues(host);
+    element.defaults = {
+      theme: "auto",
+      calculation: "automatic",
+      iterate: false,
+      iterationCount: DEFAULT_ITERATIONS,
+      iterationDelta: DEFAULT_MAX_CHANGE
+    };
+  };
+  element.addEventListener("office-options-change", (event) => {
+    const { values, changed } = event.detail;
+    for (const key of DIRECT_KEYS)
+      if (changed.includes(key)) host.setOption(key, String(values[key]));
+    if (changed.some((key) => ITERATION_KEYS.includes(key)))
+      host.setOption("iteration", iterationOf(values));
+    build();
+  });
+  element.addEventListener("office-options-cancel", () => {
+    if (hiddenOnOpen.join() !== host.hiddenActions().join())
+      host.setHiddenActions([...hiddenOnOpen]);
+  });
+  for (const name of ["office-options-change", "office-options-cancel"])
+    element.addEventListener(name, () => setTimeout(() => host.close(), 0));
+  return {
+    element,
+    show(category = "general") {
+      build();
+      hiddenOnOpen = [...host.hiddenActions()];
+      renderCustomizeRibbon(ribbon, host);
+      element.category = category;
+      element.show();
+    },
+    relocalize: build
+  };
 }
 
 // src/xlsx/backstage/pages-share.ts
@@ -999,9 +1104,7 @@ var PAGES = [
   ["saveAs", "Save As"],
   ["print", "Print"],
   ["share", "Share"],
-  ["export", "Export"],
-  ["options", "Options"],
-  ["customize", "Customize Ribbon"]
+  ["export", "Export"]
 ];
 var RENDERERS = {
   info: renderInfo,
@@ -1010,9 +1113,7 @@ var RENDERERS = {
   saveAs: renderSaveAs,
   print: renderPrint,
   share: renderShare,
-  export: renderExport,
-  options: renderOptions,
-  customize: renderCustomize
+  export: renderExport
 };
 function createBackstage(host) {
   const { ctx } = host;
@@ -1031,26 +1132,23 @@ function createBackstage(host) {
     element.append(content);
   }
   let current = "info";
-  const pageHost = {
-    ...host,
-    ctx,
-    setOption(key, value) {
-      host.setOption(key, value);
-      queueMicrotask(() => {
-        if (element.open) show(current);
-      });
-    }
-  };
+  const options = createExcelOptions(host);
   const show = (page) => {
     current = page;
-    RENDERERS[page]({ host: pageHost, content: contents.get(page), t: ctx.t, doc });
+    RENDERERS[page]({ host, content: contents.get(page), t: ctx.t, doc });
+  };
+  const showOptions = (category) => {
+    if (element.open) element.close();
+    host.close();
+    options.show(category);
   };
   element.addEventListener("office-backstage-select", (event) => {
     const id = event.detail.id;
     if (id === "save") {
       host.close();
       host.fileCommand("save");
-    } else if (contents.has(id)) show(id);
+    } else if (id === "options") showOptions();
+    else if (contents.has(id)) show(id);
   });
   element.addEventListener("office-backstage-close", (event) => {
     if (event.detail.reason !== "api") host.close();
@@ -1064,7 +1162,7 @@ function createBackstage(host) {
       ...group ? { group } : {}
     });
     const label = new Map(PAGES);
-    const page = (id, group) => item(id, label.get(id), group);
+    const page = (id) => item(id, label.get(id));
     element.items = [
       page("info"),
       page("new"),
@@ -1074,15 +1172,20 @@ function createBackstage(host) {
       page("print"),
       page("share"),
       page("export"),
-      page("options", "footer"),
-      page("customize", "footer")
+      item("options", "Options", "footer")
     ];
+    options.relocalize();
     if (element.open) show(current);
   };
   relocalize();
   return {
     element,
+    optionsDialog: options.element,
     open(page = "info") {
+      if (page === "options" || page === "customize") {
+        showOptions(page === "customize" ? "ribbon" : void 0);
+        return;
+      }
       show(page);
       element.show(page);
     },
@@ -2803,7 +2906,7 @@ function numberTab(init) {
     list.select(options.code);
     return [text(ctx, label, "xve-field-label"), list.element];
   };
-  const renderOptions2 = () => {
+  const renderOptions = () => {
     const parts = [];
     negatives = void 0;
     if (["number", "currency", "accounting", "percentage", "scientific"].includes(category))
@@ -2889,12 +2992,12 @@ function numberTab(init) {
     category = value;
     options.code = category === "custom" ? previous : LISTS[category]?.[0] ?? options.code;
     dirty = true;
-    renderOptions2();
+    renderOptions();
     update();
   });
   categories.setItems(CATEGORIES.map(([id, label]) => [id, ctx.t(label)]));
   categories.select(category);
-  renderOptions2();
+  renderOptions();
   update();
   ready = true;
   const sampleBox = el(ctx, "div");
@@ -3617,8 +3720,7 @@ function renderSharedGallery(scope, control, command) {
   });
   return gallery;
 }
-
-// src/xlsx/ribbon/overflow.ts
+var localeOf = (panel3) => normalizeEditorLocale(panel3.closest("[data-editor-locale]")?.dataset.editorLocale);
 var GROUP_ICONS = {
   Clipboard: "paste",
   Font: "fontColor",
@@ -3653,6 +3755,7 @@ var GROUP_ICONS = {
 };
 var overflow = createRibbonOverflow({
   icon: ribbonIcon,
+  moreLabel: (panel3) => translate(localeOf(panel3), "More"),
   groupIcons: GROUP_ICONS,
   fallbackIcon: "select",
   ribbon: ".xve-ribbon",
@@ -15615,6 +15718,7 @@ function createRibbon(ctx, handlers) {
     closeRibbonPopover();
     scope = { ctx, doc, updates: [], isHidden: handlers.isHidden };
     tabs2 = [...ribbonTabs()];
+    root.dataset.editorLocale = normalizeEditorLocale(ctx.locale());
     root.setAttribute("aria-label", ctx.t("Ribbon"));
     root.setAttribute("label", ctx.t("Ribbon tabs"));
     root.setAttribute("file-label", ctx.t("File"));
@@ -15882,7 +15986,7 @@ function cellMode(ctx) {
   if (mode && mode in MODE_LABELS) return mode;
   return grid?.isEditing() ? "edit" : "ready";
 }
-function statisticsText(ctx, shown2) {
+function statisticsText(ctx, shown2, limit = Infinity) {
   const workbook = ctx.workbook();
   const selection = ctx.selection.get();
   if (!workbook?.sheets?.[selection.sheet]?.rows) return "";
@@ -15897,7 +16001,7 @@ function statisticsText(ctx, shown2) {
     const text3 = key === "count" || key === "numericCount" ? formatNumber(locale, value) : formatSelectionStat(workbook, stats, value);
     parts.push(`${ctx.t(STAT_LABELS[key])}: ${text3}`);
   }
-  return parts.join("    ");
+  return parts.slice(0, limit).join("    ");
 }
 function createStatusBar(ctx, handlers) {
   defineStatusBar();
@@ -15932,6 +16036,7 @@ function createStatusBar(ctx, handlers) {
   slider.setAttribute("min", String(ZOOM_MIN));
   slider.setAttribute("max", String(ZOOM_MAX));
   element.append(stats, slider);
+  let layout = statusLayout(0);
   const zoom = () => ctx.grid()?.zoom() ?? 100;
   slider.addEventListener("input", () => handlers.setZoom(slider.value));
   element.addEventListener("office-status-activate", (event) => {
@@ -15951,7 +16056,7 @@ function createStatusBar(ctx, handlers) {
       toggles: [
         { id: "notes", icon: "warning", label: notesText, text: notesText, hidden: count === 0 }
       ],
-      views: [
+      views: !layout.views ? false : [
         { id: "normal", icon: "normalView", label: ctx.t("Normal"), pressed: true },
         {
           id: "pageLayout",
@@ -15970,7 +16075,7 @@ function createStatusBar(ctx, handlers) {
   };
   const refresh = () => {
     render3();
-    stats.textContent = statisticsText(ctx, shown2);
+    stats.textContent = statisticsText(ctx, shown2, layout.stats);
     slider.value = zoom();
   };
   const relocalize = () => {
@@ -15981,6 +16086,10 @@ function createStatusBar(ctx, handlers) {
     refresh();
   };
   relocalize();
+  watchStatusWidth(element, (width) => {
+    layout = statusLayout(width);
+    refresh();
+  });
   return { element, refresh, relocalize };
 }
 var SAVE_STATE_TEXT = {
@@ -16265,6 +16374,7 @@ function buildShell(core) {
     canvasRow,
     statusBar.element,
     backstage.element,
+    backstage.optionsDialog,
     help.element,
     toaster.element
   );