SearSuite
← All packages

@searsuite/sear-plugin-web-toolbar

Web Sheet toolbar controls built on typed commands and observations.

Toolbar commands

variableWebSheetAdapterDefaults
WebSheetAdapterDefaults: { clipboard: typeof WebSheetClipboard; createTextShaper: (context: RenderContext): WebTextShaper; fileDownload: typeof WebFileDownload; userInteraction: typeof WebUserInteractionService }

Web implementations supplied by a Sheet host at its composition root.

functionensureSheetToolbarCommands
ensureSheetToolbarCommands(commands: SheetCommandBus, core: SearCoreSheet): void

Ensures web toolbar hosts receive the official sheet command surface.

functionregisterSheetToolbarCommands
registerSheetToolbarCommands(commands: SheetCommandBus, core: SearCoreSheet): void

Registers official sheet commands needed by web toolbar hosts.

Web controls

classSearWebToolbar
class SearWebToolbar extends SearToolbar

Browser DOM toolbar implementation for the sheet editor.

constructorSearWebToolbar(searCore: SearCoreSheet, platform: Platform, embeddedEditor: SheetEmbeddedEditor, clipboard: SheetClipboard, userInteraction: UserInteractionService, commands?: SheetCommandBus, history?: SheetHistoryStatusProvider, queries?: SheetQueryRegistry, observations?: ObservationRegistry, fileDownload?: FileDownload, sheetTextInput?: TextInput): SearWebToolbar

Constructs the toolbar adapter for one sheet editor.

propertyreadonly symbol: typeof symbolstatic

DI token for resolving the web toolbar adapter.

methoddestroy(): void

Removes DOM nodes and subscriptions owned by the toolbar.

methodmount(target: unknown): void

Mounts the toolbar into a host DOM element.

classWebSheetClipboard
class WebSheetClipboard extends SheetClipboard

Browser Clipboard API adapter; DOM events never cross this boundary.

constructorWebSheetClipboard(): WebSheetClipboard
methodread(): Promise<SheetClipboardPayload | null>
methodwrite(payload: SheetClipboardPayload): Promise<void>
Inherited members 1

Inherited from SheetClipboard.

variableDESIGNED_TOOLBAR_ICONS
DESIGNED_TOOLBAR_ICONS: { alignBottom: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"144.96 1142 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 154 1182)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Z\"/><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 160 1150)\" d=\"M1.6 0L1.6 24Q1.6193 24.6707 1.1314 25.1314Q0.6707 25.6193 0 25.6Q-0.6707 25.6193 -1.1314 25.1314Q-1.6193 24.6707 -1.6 24L-1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Q0.6707 -1.6193 1.1314 -1.1314Q1.6193 -0.6707 1.6 0ZM21.6 0L21.6 24Q21.6193 24.6707 21.1314 25.1314Q20.6707 25.6193 20 25.6Q19.3293 25.6193 18.8686 25.1314Q18.3807 24.6707 18.4 24L18.4 0Q18.3807 -0.6707 18.8686 -1.1314Q19.3293 -1.6193 20 -1.6Q20.6707 -1.6193 21.1314 -1.1314Q21.6193 -0.6707 21.6 0ZM11.6 10L11.6 24Q11.6193 24.6707 11.1314 25.1314Q10.6707 25.6193 10 25.6Q9.3293 25.6193 8.8686 25.1314Q8.3807 24.6707 8.4 24L8.4 10Q8.3807 9.3293 8.8686 8.8686Q9.3293 8.3807 10 8.4Q10.6707 8.3807 11.1314 8.8686Q11.6193 9.3293 11.6 10Z\"/></svg>"; alignCenter: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"316.19 1019 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 326 1029)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6ZM7 8.4L25 8.4Q25.6707 8.3807 26.1314 8.8686Q26.6193 9.3293 26.6 10Q26.6193 10.6707 26.1314 11.1314Q25.6707 11.6193 25 11.6L7 11.6Q6.3293 11.6193 5.8686 11.1314Q5.3807 10.6707 5.4 10Q5.3807 9.3293 5.8686 8.8686Q6.3293 8.3807 7 8.4ZM0 18.4L32 18.4Q32.6707 18.3807 33.1314 18.8686Q33.6193 19.3293 33.6 20Q33.6193 20.6707 33.1314 21.1314Q32.6707 21.6193 32 21.6L0 21.6Q-0.6707 21.6193 -1.1314 21.1314Q-1.6193 20.6707 -1.6 20Q-1.6193 19.3293 -1.1314 18.8686Q-0.6707 18.3807 0 18.4ZM7 28.4L25 28.4Q25.6707 28.3807 26.1314 28.8686Q26.6193 29.3293 26.6 30Q26.6193 30.6707 26.1314 31.1314Q25.6707 31.6193 25 31.6L7 31.6Q6.3293 31.6193 5.8686 31.1314Q5.3807 30.6707 5.4 30Q5.3807 29.3293 5.8686 28.8686Q6.3293 28.3807 7 28.4Z\"/></svg>"; alignLeft: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"144.92 1019 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 154 1029)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6ZM0 8.4L18 8.4Q18.6707 8.3807 19.1314 8.8686Q19.6193 9.3293 19.6 10Q19.6193 10.6707 19.1314 11.1314Q18.6707 11.6193 18 11.6L0 11.6Q-0.6707 11.6193 -1.1314 11.1314Q-1.6193 10.6707 -1.6 10Q-1.6193 9.3293 -1.1314 8.8686Q-0.6707 8.3807 0 8.4ZM0 18.4L32 18.4Q32.6707 18.3807 33.1314 18.8686Q33.6193 19.3293 33.6 20Q33.6193 20.6707 33.1314 21.1314Q32.6707 21.6193 32 21.6L0 21.6Q-0.6707 21.6193 -1.1314 21.1314Q-1.6193 20.6707 -1.6 20Q-1.6193 19.3293 -1.1314 18.8686Q-0.6707 18.3807 0 18.4ZM0 28.4L18 28.4Q18.6707 28.3807 19.1314 28.8686Q19.6193 29.3293 19.6 30Q19.6193 30.6707 19.1314 31.1314Q18.6707 31.6193 18 31.6L0 31.6Q-0.6707 31.6193 -1.1314 31.1314Q-1.6193 30.6707 -1.6 30Q-1.6193 29.3293 -1.1314 28.8686Q-0.6707 28.3807 0 28.4Z\"/></svg>"; alignMiddle: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"1004.38 1019 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 1014 1043)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Z\"/><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 1020 1027)\" d=\"M1.6 0L1.6 10Q1.6193 10.6707 1.1314 11.1314Q0.6707 11.6193 0 11.6Q-0.6707 11.6193 -1.1314 11.1314Q-1.6193 10.6707 -1.6 10L-1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Q0.6707 -1.6193 1.1314 -1.1314Q1.6193 -0.6707 1.6 0ZM21.6 0L21.6 10Q21.6193 10.6707 21.1314 11.1314Q20.6707 11.6193 20 11.6Q19.3293 11.6193 18.8686 11.1314Q18.3807 10.6707 18.4 10L18.4 0Q18.3807 -0.6707 18.8686 -1.1314Q19.3293 -1.6193 20 -1.6Q20.6707 -1.6193 21.1314 -1.1314Q21.6193 -0.6707 21.6 0ZM1.6 22L1.6 32Q1.6193 32.6707 1.1314 33.1314Q0.6707 33.6193 0 33.6Q-0.6707 33.6193 -1.1314 33.1314Q-1.6193 32.6707 -1.6 32L-1.6 22Q-1.6193 21.3293 -1.1314 20.8686Q-0.6707 20.3807 0 20.4Q0.6707 20.3807 1.1314 20.8686Q1.6193 21.3293 1.6 22ZM21.6 22L21.6 32Q21.6193 32.6707 21.1314 33.1314Q20.6707 33.6193 20 33.6Q19.3293 33.6193 18.8686 33.1314Q18.3807 32.6707 18.4 32L18.4 22Q18.3807 21.3293 18.8686 20.8686Q19.3293 20.3807 20 20.4Q20.6707 20.3807 21.1314 20.8686Q21.6193 21.3293 21.6 22Z\"/></svg>"; alignRight: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"488.96 1019 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 498 1029)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6ZM14 8.4L32 8.4Q32.6707 8.3807 33.1314 8.8686Q33.6193 9.3293 33.6 10Q33.6193 10.6707 33.1314 11.1314Q32.6707 11.6193 32 11.6L14 11.6Q13.3293 11.6193 12.8686 11.1314Q12.3807 10.6707 12.4 10Q12.3807 9.3293 12.8686 8.8686Q13.3293 8.3807 14 8.4ZM0 18.4L32 18.4Q32.6707 18.3807 33.1314 18.8686Q33.6193 19.3293 33.6 20Q33.6193 20.6707 33.1314 21.1314Q32.6707 21.6193 32 21.6L0 21.6Q-0.6707 21.6193 -1.1314 21.1314Q-1.6193 20.6707 -1.6 20Q-1.6193 19.3293 -1.1314 18.8686Q-0.6707 18.3807 0 18.4ZM14 28.4L32 28.4Q32.6707 28.3807 33.1314 28.8686Q33.6193 29.3293 33.6 30Q33.6193 30.6707 33.1314 31.1314Q32.6707 31.6193 32 31.6L14 31.6Q13.3293 31.6193 12.8686 31.1314Q12.3807 30.6707 12.4 30Q12.3807 29.3293 12.8686 28.8686Q13.3293 28.3807 14 28.4Z\"/></svg>"; alignTop: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"833.15 1019 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 842 1027)\" d=\"M0 -1.6L32 -1.6Q32.6707 -1.6193 33.1314 -1.1314Q33.6193 -0.6707 33.6 0Q33.6193 0.6707 33.1314 1.1314Q32.6707 1.6193 32 1.6L0 1.6Q-0.6707 1.6193 -1.1314 1.1314Q-1.6193 0.6707 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Z\"/><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 848 1035)\" d=\"M1.6 0L1.6 24Q1.6193 24.6707 1.1314 25.1314Q0.6707 25.6193 0 25.6Q-0.6707 25.6193 -1.1314 25.1314Q-1.6193 24.6707 -1.6 24L-1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6Q0.6707 -1.6193 1.1314 -1.1314Q1.6193 -0.6707 1.6 0ZM11.6 0L11.6 14Q11.6193 14.6707 11.1314 15.1314Q10.6707 15.6193 10 15.6Q9.3293 15.6193 8.8686 15.1314Q8.3807 14.6707 8.4 14L8.4 0Q8.3807 -0.6707 8.8686 -1.1314Q9.3293 -1.6193 10 -1.6Q10.6707 -1.6193 11.1314 -1.1314Q11.6193 -0.6707 11.6 0ZM21.6 0L21.6 24Q21.6193 24.6707 21.1314 25.1314Q20.6707 25.6193 20 25.6Q19.3293 25.6193 18.8686 25.1314Q18.3807 24.6707 18.4 24L18.4 0Q18.3807 -0.6707 18.8686 -1.1314Q19.3293 -1.6193 20 -1.6Q20.6707 -1.6193 21.1314 -1.1314Q21.6193 -0.6707 21.6 0Z\"/></svg>"; allBorders: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"144.90 1696 50 50\" fill=\"none\" aria-hidden=\"true\"><rect xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"#334155\" stroke-width=\"3.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" transform=\"matrix(1 0 0 1 154 1704)\" width=\"32\" height=\"32\" rx=\"4\" ry=\"4\"/><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 154 1704)\" d=\"M17.6 0L17.6 14.4L32 14.4Q32.6707 14.3807 33.1314 14.8686Q33.6193 15.3293 33.6 16Q33.6193 16.6707 33.1314 17.1314Q32.6707 17.6193 32 17.6L17.6 17.6L17.6 32Q17.6193 32.6707 17.1314 33.1314Q16.6707 33.6193 16 33.6Q15.3293 33.6193 14.8686 33.1314Q14.3807 32.6707 14.4 32L14.4 17.6L0 17.6Q-0.6707 17.6193 -1.1314 17.1314Q-1.6193 16.6707 -1.6 16Q-1.6193 15.3293 -1.1314 14.8686Q-0.6707 14.3807 0 14.4L14.4 14.4L14.4 0Q14.3807 -0.6707 14.8686 -1.1314Q15.3293 -1.6193 16 -1.6Q16.6707 -1.6193 17.1314 -1.1314Q17.6193 -0.6707 17.6 0Z\"/></svg>"; autoSum: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"661.94 2250 50 50\" fill=\"none\" aria-hidden=\"true\"><path xmlns=\"http://www.w3.org/2000/svg\" fill=\"#334155\" transform=\"matrix(1 0 0 1 675 2258)\" d=\"M22 1.6L3.2 1.6L13.28 15.04Q13.6087 15.4638 13.6 16Q13.6087 16.5362 13.28 16.96L3.2 30.4L22 30.4Q22.6707 30.3807 23.1314 30.8686Q23.6193 31.3293 23.6 32Q23.6193 32.6707 23.1314 33.1314Q22.6707 33.6193 22 33.6L0 33.6Q-0.2597 33.6005 -0.506 33.5179Q-0.7525 33.4363 -0.96 33.28Q-1.5082 32.893 -1.5839 32.2263Q-1.6979 31.565 -1.28 31.04L10 16L-1.28 0.96Q-1.4363 0.7525 -1.5179 0.506Q-1.6005 0.2597 -1.6 0Q-1.6193 -0.6707 -1.1314 -1.1314Q-0.6707 -1.6193 0 -1.6L22 -1.6Q22.6707 -1.6193 23.1314 -1.1314Q23.6193 -0.6707 23.6 0Q23.6193 0.6707 23.1314 1.1314Q22.6707 1.6193 22 1.6Z\"/></svg>"; … }
variableTOOLBAR_CSS
TOOLBAR_CSS: "\n.sear-sheet-context-menu { position: fixed; z-index: 10020; min-width: 148px; padding: 4px; background: #fff; color: #222; border: 1px solid #dcdde5; border-radius: 6px; box-shadow: 0 8px 24px #0002; font: 13px sans-serif; }\n.sear-sheet-context-menu button { display: block; width: 100%; padding: 7px 10px; border: 0; border-radius: 3px; background: transparent; color: inherit; text-align: left; cursor: pointer; }\n.sear-sheet-context-menu button:hover, .sear-sheet-context-menu button:focus-visible { background: #eef3ff; outline: 0; }\n.sear-cell-border-menu { position: fixed; z-index: 10000; display: flex; gap: 16px; box-sizing: border-box; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow-y: auto; padding: 12px; background: #fff; color: #222; border: 1px solid #dcdde5; border-radius: 8px; box-shadow: 0 8px 24px #0002; font: 14px sans-serif; }\n.sear-cell-border-presets { display: grid; grid-template-columns: repeat(3, 42px); gap: 4px; }\n.sear-cell-border-presets button { width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 4px; background: transparent; color: #303438; cursor: pointer; }\n.sear-cell-border-presets button:hover { background: #eef0f2; }\n.sear-cell-border-presets button svg { width: 28px; height: 28px; }\n.sear-cell-border-presets button:focus-visible { outline: 2px solid #386ef6; }\n.sear-cell-border-controls { width: 164px; display: flex; flex-direction: column; gap: 16px; }\n.sear-cell-border-controls label { display: flex; align-items: center; justify-content: space-between; gap: 12px; }\n.sear-cell-border-controls input { width: 114px; height: 32px; padding: 3px; border: 1px solid #dcdde5; border-radius: 4px; background: white; cursor: pointer; }\n.sear-cell-border-controls select { width: 114px; height: 32px; border: 1px solid #dcdde5; border-radius: 4px; background: white; color: #222; }\n.sear-cell-border-preview { display: grid; place-items: center; height: 32px; border-top: 1px solid #eef0f2; }\n@media (max-width: 360px) {\n .sear-cell-border-menu { flex-direction: column; box-sizing: border-box; width: calc(100vw - 16px); }\n .sear-cell-border-presets { grid-template-columns: repeat(5, 42px); }\n .sear-cell-border-controls { width: 100%; }\n}\n.sear-toolbar {\n --wd3-level-1: rgba(23, 24, 28, 0.94);\n --wd3-level-2: rgba(23, 24, 28, 0.62);\n --wd3-level-3: rgba(23, 24, 28, 0.4);\n --wd3-line: rgba(23, 26, 29, 0.08);\n --wd3-hover: rgba(23, 26, 29, 0.06);\n --wd3-active: rgba(63, 133, 255, 0.1);\n --wd3-blue: #256cfb;\n box-sizing: border-box;\n width: 100%;\n min-height: 80px;\n background: #fff;\n color: var(--wd3-level-1);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", \"Microsoft YaHei\", Arial, sans-serif;\n font-size: 12px;\n user-select: none;\n overflow: hidden;\n}\n\n.sear-toolbar *,\n.sear-toolbar *::before,\n.sear-toolbar *::after {\n box-sizing: border-box;\n}\n\n.sear-toolbar .we-toolbar-wrapper {\n height: 80px;\n padding: 0;\n border-bottom: 1px solid var(--wd3-line);\n background: #fff;\n overflow: visible;\n}\n\n.sear-toolbar .style__LineWrap-wd3__sc-qvsygq-2 {\n display: flex;\n align-items: stretch;\n gap: 0;\n height: 80px;\n padding: 6px 8px 5px;\n overflow-x: auto;\n overflow-y: visible;\n white-space: nowrap;\n}\n\n.sear-toolbar .style__LineWrap-wd3__sc-qvsygq-2::-webkit-scrollbar {\n height: 3px;\n}\n\n.sear-toolbar .style__LineWrap-wd3__sc-qvsygq-2::-webkit-scrollbar-thumb {\n background: rgba(23, 26, 29, 0.18);\n border-radius: 2px;\n}\n\n.sear-toolbar .style__Group-wd3__sc-qvsygq-3,\n.sear-toolbar .wd3-toolbar-more {\n position: relative;\n display: flex;\n align-items: center;\n gap: 2px;\n min-width: max-content;\n padding: 0 8px;\n}\n\n.sear-toolbar .style__Group-wd3__sc-qvsygq-3::after,\n.sear-toolbar .wd3-toolbar-more::after {\n content: \"\";\n position: absolute;\n top: 8px;\n right: 0;\n width: 1px;\n height: 52px;\n background: var(--wd3-line);\n}\n\n.sear-toolbar .style__GroupRows-wd3__sc-qvsygq-4 {\n flex-direction: column;\n justify-content: center;\n gap: 4px;\n}\n\n.sear-toolbar .style__Row-wd3__sc-qvsygq-5 {\n display: flex;\n align-items: center;\n height: 28px;\n gap: 2px;\n}\n\n.sear-toolbar .style__ItemWrap-wd3__sc-qvsygq-6 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 24px;\n height: 28px;\n}\n\n.sear-toolbar .render-items__MeasureWrap-wd3__sc-1etwew8-0,\n.sear-toolbar .slot__TBItemSlotWrap-wd3__sc-1p9e5wr-0 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n}\n\n.sear-toolbar button,\n.sear-toolbar .wd3-toolbar-item-select {\n border: 0;\n appearance: none;\n font: inherit;\n color: inherit;\n}\n\n.sear-toolbar .wd3-toolbar-item {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n background: transparent;\n color: var(--wd3-level-1);\n cursor: default;\n outline: none;\n}\n\n.sear-toolbar .wd3-toolbar-icon-button.small,\n.sear-toolbar .wd3-toolbar-icon-menu.small {\n width: 24px;\n height: 24px;\n}\n\n.sear-toolbar .wd3-toolbar-split-btn-host {\n width: 34px;\n height: 24px;\n}\n\n.sear-toolbar .wd3-toolbar-icon-button.large,\n.sear-toolbar .wd3-toolbar-icon-menu.large {\n min-width: 32px;\n height: 66px;\n padding: 4px 0 3px;\n flex-direction: column;\n}\n\n.sear-toolbar .wd3-toolbar-icon-menu.large {\n padding-left: 2px;\n padding-right: 2px;\n}\n\n.sear-toolbar .wd3-toolbar-item:not(.disabled):hover,\n.sear-toolbar .wd3-toolbar-item-select:hover,\n.sear-toolbar .wd3-icon-button:hover {\n background: var(--wd3-hover);\n}\n\n.sear-toolbar .wd3-toolbar-item:not(.disabled):active,\n.sear-toolbar .wd3-toolbar-item-select:active,\n.sear-toolbar .wd3-icon-button:active {\n background: var(--wd3-active);\n}\n\n.sear-toolbar .wd3-toolbar-item-active {\n background: var(--wd3-active);\n color: var(--wd3-blue);\n}\n\n.sear-toolbar .wd3-toolbar-item.disabled {\n color: var(--wd3-level-3);\n opacity: 0.38;\n}\n\n.sear-toolbar .styled__Content-wd3__sc-18mbnsa-2,\n.sear-toolbar .styled__IconWithArrowWrap-wd3__sc-1vmuis-1 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n min-height: 20px;\n line-height: 0;\n}\n\n.sear-toolbar .wd3-toolbar-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n color: currentColor;\n}\n\n.sear-toolbar .small .wd3-toolbar-icon,\n.sear-toolbar .wd3-toolbar-split-left {\n width: 20px;\n height: 20px;\n}\n\n.sear-toolbar svg {\n display: block;\n flex: 0 0 auto;\n}\n\n.sear-toolbar .small .wd3-toolbar-icon > svg,\n.sear-toolbar .wd3-toolbar-split-left > svg {\n width: 16px;\n height: 16px;\n}\n\n.sear-toolbar .wd3-toolbar-title {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 28px;\n padding-top: 2px;\n color: var(--wd3-level-2);\n font-size: 11px;\n line-height: 14px;\n}\n\n.sear-toolbar .wd3-tb-title-content {\n max-width: 54px;\n overflow: hidden;\n text-align: center;\n text-overflow: ellipsis;\n white-space: normal;\n}\n\n.sear-toolbar .wd3-tb-title-content-nowrap {\n white-space: nowrap;\n}\n\n.sear-toolbar .wd3-select {\n position: relative;\n justify-content: space-between;\n height: 24px;\n min-width: 0;\n padding: 0 4px 0 8px;\n border: 1px solid transparent;\n border-radius: 4px;\n background: transparent;\n font-size: 12px;\n line-height: 22px;\n}\n\n.sear-toolbar .wd3-select-normal-value,\n.sear-toolbar .wd3-select-input-value {\n min-width: 0;\n overflow: hidden;\n color: var(--wd3-level-1);\n text-align: left;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.sear-toolbar .wd3_select_arrow,\n.sear-toolbar .wd3-toolbar-split-btn-arrow {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 9px;\n margin-left: 3px;\n color: var(--wd3-level-3);\n}\n\n.sear-toolbar .wd3-toolbar-split-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 34px;\n height: 24px;\n overflow: visible;\n line-height: 0;\n}\n\n.sear-toolbar .wd3-toolbar-split-left {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n\n.sear-toolbar .style__Grow-wd3__sc-qvsygq-0 {\n flex: 1 1 auto;\n min-width: 16px;\n}\n\n.sear-toolbar .wd3-toolbar-mode-switch-wrap {\n position: relative;\n display: flex;\n align-items: center;\n height: 28px;\n align-self: center;\n}\n\n.sear-toolbar .wd3-icon-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n border-radius: 6px;\n background: transparent;\n}\n\n.sear-toolbar-insert-popovers {\n position: fixed;\n inset: 0;\n z-index: 9999;\n pointer-events: none;\n}\n\n.sear-toolbar-popovers {\n position: fixed;\n inset: 0;\n z-index: 9999;\n pointer-events: none;\n}\n\n.sear-toolbar-insert-popover {\n position: fixed;\n pointer-events: auto;\n}\n\n.sear-toolbar-popover {\n position: fixed;\n pointer-events: auto;\n}\n\n.sear-toolbar-insert-popover .wd3-popover,\n.sear-toolbar-popover .wd3-popover {\n overflow: hidden;\n border: 1px solid rgba(23, 26, 29, 0.12);\n border-radius: 16px;\n background: #fff;\n box-shadow:\n 0 14px 38px rgba(23, 26, 29, 0.14),\n 0 2px 6px rgba(23, 26, 29, 0.08);\n}\n\n.sear-toolbar-insert-popover .wd3-menu,\n.sear-toolbar-popover .wd3-menu {\n display: flex;\n flex-direction: column;\n padding: 4px 10px 4px 6px;\n color: rgba(23, 24, 28, 0.82);\n font-size: 13px;\n font-weight: 400;\n line-height: 1;\n}\n.sear-toolbar-popover .wd3-menu { max-height: calc(100vh - 16px); overflow-y: auto; }\n\n.sear-toolbar-insert-popover .wd3-menu {\n width: 180px;\n}\n\n.sear-toolbar-insert-popover:nth-child(n + 2) .wd3-menu {\n width: 200px;\n}\n\n.sear-toolbar-insert-popover:nth-child(3) .wd3-menu {\n width: 202px;\n}\n\n.sear-toolbar-insert-popover .wd3-listitem,\n.sear-toolbar-popover .wd3-listitem {\n display: flex;\n align-items: center;\n min-height: 28px;\n border-radius: 6px;\n cursor: default;\n font-weight: 400;\n}\n\n.sear-toolbar-popover button.wd3-listitem {\n width: 100%;\n padding: 0;\n border: 0;\n background: transparent;\n color: inherit;\n text-align: left;\n font: inherit;\n}\n\n.sear-toolbar-popover button[aria-disabled=\"true\"] {\n color: #8b9297;\n cursor: not-allowed;\n}\n\n.sear-toolbar-insert-popover .wd3-listitem:hover,\n.sear-toolbar-insert-popover .wd3-listitem-active,\n.sear-toolbar-popover .wd3-listitem:hover,\n.sear-toolbar-popover .wd3-listitem-active {\n background: rgba(23, 26, 29, 0.05);\n}\n\n.sear-toolbar-insert-popover .styled__Container-wd3__sc-2oqy5e-3,\n.sear-toolbar-popover .styled__Container-wd3__sc-2oqy5e-3 {\n display: flex;\n align-items: center;\n width: 100%;\n min-width: 0;\n}\n\n.sear-toolbar-insert-popover .styled__Prefix-wd3__sc-2oqy5e-4,\n.sear-toolbar-popover .styled__Prefix-wd3__sc-2oqy5e-4 {\n display: inline-flex;\n flex: 0 0 32px;\n align-items: center;\n justify-content: center;\n color: rgba(23, 24, 28, 0.78);\n}\n\n.sear-toolbar-popover .sear-toolbar-popover-prefix {\n flex-basis: 24px;\n}\n\n.sear-toolbar-insert-popover .styled__Prefix-wd3__sc-2oqy5e-4 svg,\n.sear-toolbar-popover .styled__Prefix-wd3__sc-2oqy5e-4 svg {\n width: 16px;\n height: 16px;\n}\n\n.sear-toolbar-insert-popover .styled__Content-wd3__sc-2oqy5e-6,\n.sear-toolbar-popover .styled__Content-wd3__sc-2oqy5e-6 {\n display: inline-flex;\n flex: 1 1 auto;\n align-items: center;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.sear-toolbar-insert-popover .styled__Suffix-wd3__sc-2oqy5e-5,\n.sear-toolbar-popover .styled__Suffix-wd3__sc-2oqy5e-5 {\n display: inline-flex;\n flex: 0 0 auto;\n align-items: center;\n justify-content: center;\n margin-left: 6px;\n color: rgba(23, 24, 28, 0.66);\n}\n\n.sear-toolbar-popover .styled__Suffix-wd3__sc-2oqy5e-5 {\n font-size: 11px;\n}\n\n.sear-toolbar-insert-popover .styled__SuffixWrapper-wd3__sc-1p5lith-0 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 10px;\n height: 16px;\n}\n\n.sear-toolbar-popover .styled__Suffix-wd3__sc-2oqy5e-5 svg,\n.sear-toolbar-insert-popover .styled__SuffixWrapper-wd3__sc-1p5lith-0 svg {\n width: 8px;\n height: 16px;\n}\n\n.sear-toolbar-insert-popover .styled__Divider-wd3__sc-2oqy5e-1,\n.sear-toolbar-popover .styled__Divider-wd3__sc-2oqy5e-1 {\n height: 1px;\n margin: 4px 0;\n background: rgba(23, 26, 29, 0.12);\n}\n\n.sear-toolbar-popover .wd3-listitem-selected {\n color: rgba(37, 108, 251, 0.95);\n}\n\n.sear-toolbar-color-menu {\n padding: 10px;\n color: rgba(23, 24, 28, 0.82);\n font-size: 13px;\n font-weight: 400;\n}\n\n.sear-toolbar-color-title {\n height: 22px;\n padding: 0 2px;\n color: rgba(23, 24, 28, 0.62);\n font-size: 12px;\n line-height: 22px;\n}\n\n.sear-toolbar-color-grid {\n display: grid;\n grid-template-columns: repeat(8, 20px);\n gap: 6px;\n margin-top: 4px;\n}\n\n.sear-toolbar-color-swatch {\n width: 20px;\n height: 20px;\n padding: 0;\n border: 1px solid rgba(23, 26, 29, 0.14);\n border-radius: 4px;\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);\n cursor: default;\n}\n\n.sear-toolbar-color-swatch:hover {\n border-color: rgba(37, 108, 251, 0.82);\n box-shadow:\n inset 0 0 0 1px rgba(255, 255, 255, 0.72),\n 0 0 0 2px rgba(37, 108, 251, 0.12);\n}\n\n.sear-toolbar-color-swatch-selected {\n outline: 2px solid #256cfb;\n outline-offset: 1px;\n}\n\n.sear-toolbar-color-swatch-default {\n position: relative;\n background: #fff;\n}\n\n.sear-toolbar-color-swatch-default::after {\n position: absolute;\n top: 9px;\n left: 1px;\n width: 18px;\n height: 1px;\n background: #fe0300;\n content: '';\n transform: rotate(-45deg);\n}\n\n.sear-toolbar-insert-popover .wd3-shortcuts {\n display: inline-flex;\n align-items: center;\n gap: 3px;\n}\n\n.sear-toolbar-insert-popover .wd3-shortcuts kbd {\n min-width: 19px;\n height: 19px;\n padding: 0 5px;\n border: 1px solid rgba(107, 114, 148, 0.24);\n border-radius: 4px;\n background: #fff;\n box-shadow: 0 1px 3px rgba(23, 26, 29, 0.12);\n color: rgba(107, 114, 148, 0.92);\n font: inherit;\n font-size: 10px;\n line-height: 17px;\n text-align: center;\n}\n\n.sear-toolbar-insert-popover .wd3-badge-new {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 16px;\n margin-left: 7px;\n padding: 0 5px;\n border-radius: 3px;\n background: #ffe9dc;\n color: #ff7a45;\n font-size: 9px;\n line-height: 16px;\n}\n\n.sear-number-format-dialog {\n width: min(920px, calc(100vw - 32px));\n height: min(680px, calc(100vh - 32px));\n padding: 0;\n overflow: hidden;\n border: 1px solid #d9dde3;\n border-radius: 8px;\n background: #fff;\n color: #20242a;\n box-shadow: 0 18px 56px rgba(24, 31, 42, 0.2);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", Arial, sans-serif;\n}\n\n.sear-number-format-dialog::backdrop {\n background: rgba(24, 31, 42, 0.36);\n}\n\n.sear-number-format-dialog > header,\n.sear-number-format-dialog > footer {\n display: flex;\n align-items: center;\n padding: 18px 24px;\n}\n\n.sear-number-format-dialog > header {\n justify-content: space-between;\n border-bottom: 1px solid #edf0f3;\n}\n\n.sear-number-format-dialog > header h2 {\n margin: 0;\n font-size: 22px;\n font-weight: 600;\n letter-spacing: 0;\n}\n\n.sear-number-format-dialog__close {\n width: 32px;\n height: 32px;\n padding: 0;\n border: 0;\n background: transparent;\n color: #4f5660;\n font-size: 30px;\n font-weight: 300;\n line-height: 28px;\n cursor: pointer;\n}\n\n.sear-number-format-dialog__body {\n display: grid;\n grid-template-columns: 190px minmax(0, 1fr);\n height: calc(100% - 137px);\n min-height: 0;\n padding: 18px 24px 0;\n gap: 28px;\n}\n\n.sear-number-format-dialog__categories {\n display: flex;\n min-height: 0;\n padding: 8px;\n overflow-y: auto;\n flex-direction: column;\n border: 1px solid #d9dde3;\n border-radius: 6px;\n}\n\n.sear-number-format-dialog__categories button {\n min-height: 38px;\n padding: 7px 12px;\n border: 0;\n border-radius: 5px;\n background: transparent;\n color: #2d333b;\n font: inherit;\n font-size: 15px;\n text-align: left;\n cursor: pointer;\n}\n\n.sear-number-format-dialog__categories button:hover {\n background: #f2f4f7;\n}\n\n.sear-number-format-dialog__categories button.is-active {\n background: #e9f1ff;\n color: #256cfb;\n}\n\n.sear-number-format-dialog__panel {\n display: grid;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n align-content: start;\n grid-template-columns: 1fr;\n gap: 10px;\n padding: 0 4px 16px 0;\n}\n\n.sear-number-format-dialog__panel > label,\n.sear-number-format-dialog__section-title {\n color: #5d6570;\n font-size: 13px;\n font-weight: 500;\n}\n\n.sear-number-format-dialog__preview {\n display: flex;\n min-height: 54px;\n align-items: center;\n padding: 0 16px;\n overflow: hidden;\n border: 1px solid #d6dae0;\n border-radius: 6px;\n background: #f7f8fa;\n color: #20242a;\n font-size: 22px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.sear-number-format-dialog__section-title {\n margin-top: 8px;\n}\n\n.sear-number-format-dialog__presets {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: 8px;\n}\n\n.sear-number-format-dialog__preset {\n display: grid;\n min-width: 0;\n min-height: 54px;\n padding: 8px 10px;\n border: 1px solid #d9dde3;\n border-radius: 6px;\n background: #fff;\n color: #282e36;\n text-align: left;\n cursor: pointer;\n}\n\n.sear-number-format-dialog__preset:hover {\n border-color: #9dbdff;\n background: #f7faff;\n}\n\n.sear-number-format-dialog__preset.is-active {\n border-color: #256cfb;\n background: #edf4ff;\n box-shadow: inset 0 0 0 1px #256cfb;\n}\n\n.sear-number-format-dialog__preset span {\n overflow: hidden;\n font-size: 14px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.sear-number-format-dialog__preset code {\n overflow: hidden;\n color: #69717d;\n font-size: 12px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.sear-number-format-dialog__custom {\n box-sizing: border-box;\n width: 100%;\n height: 38px;\n padding: 7px 10px;\n border: 1px solid #cbd1d9;\n border-radius: 5px;\n color: #20242a;\n font: 13px/1.4 ui-monospace, SFMono-Regular, Consolas, monospace;\n}\n\n.sear-number-format-dialog > footer {\n justify-content: flex-end;\n gap: 10px;\n border-top: 1px solid #edf0f3;\n}\n\n.sear-number-format-dialog__button {\n min-width: 82px;\n min-height: 38px;\n padding: 7px 18px;\n border: 1px solid #cbd1d9;\n border-radius: 5px;\n background: #fff;\n color: #2d333b;\n font: inherit;\n font-size: 14px;\n cursor: pointer;\n}\n\n.sear-number-format-dialog__button.is-primary {\n border-color: #256cfb;\n background: #256cfb;\n color: #fff;\n}\n\n@media (max-width: 680px) {\n .sear-number-format-dialog__body {\n grid-template-columns: 126px minmax(0, 1fr);\n gap: 12px;\n padding-inline: 12px;\n }\n\n .sear-number-format-dialog__presets {\n grid-template-columns: 1fr;\n }\n}\n\n.sear-toolbar__toast {\n position: fixed;\n bottom: 24px;\n left: 50%;\n z-index: 10000;\n padding: 9px 16px;\n border-radius: 6px;\n background: rgba(54, 55, 56, 0.96);\n box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);\n color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", Arial, sans-serif;\n font-size: 13px;\n line-height: 18px;\n pointer-events: none;\n transform: translateX(-50%);\n}\n\n.sear-toolbar-duplicate-dialog {\n position: fixed;\n inset: 0;\n z-index: 9999;\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgba(12, 16, 24, 0.18);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", Arial, sans-serif;\n}\n\n.sear-toolbar-duplicate-panel {\n position: relative;\n width: 360px;\n max-width: calc(100vw - 32px);\n padding: 22px 20px 18px;\n border: 1px solid rgba(23, 26, 29, 0.08);\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 18px 48px rgba(16, 24, 40, 0.18);\n color: rgba(23, 24, 28, 0.94);\n}\n\n.sear-toolbar-duplicate-close {\n position: absolute;\n top: 14px;\n right: 14px;\n width: 28px;\n height: 28px;\n border: 0;\n background: transparent;\n color: rgba(23, 24, 28, 0.62);\n font: 26px/28px Arial, sans-serif;\n}\n\n.sear-toolbar-duplicate-title {\n margin: 0 36px 18px 0;\n font-size: 20px;\n font-weight: 600;\n line-height: 28px;\n}\n\n.sear-toolbar-duplicate-row,\n.sear-toolbar-duplicate-column {\n display: flex;\n align-items: center;\n gap: 10px;\n min-height: 34px;\n font-size: 15px;\n}\n\n.sear-toolbar-duplicate-row select {\n height: 28px;\n padding: 0 24px 0 8px;\n border: 1px solid #d7dce2;\n border-radius: 4px;\n background: #fff;\n font: inherit;\n}\n\n.sear-toolbar-duplicate-columns {\n max-height: 180px;\n margin: 12px 0;\n padding: 8px;\n overflow: auto;\n border: 1px solid rgba(23, 26, 29, 0.08);\n border-radius: 6px;\n}\n\n.sear-toolbar-duplicate-actions {\n display: flex;\n justify-content: flex-end;\n gap: 10px;\n margin-top: 18px;\n}\n\n.sear-toolbar-duplicate-actions button {\n min-width: 76px;\n min-height: 36px;\n border: 1px solid #d7dce2;\n border-radius: 5px;\n background: #fff;\n color: rgba(23, 24, 28, 0.94);\n font: inherit;\n font-size: 14px;\n}\n\n.sear-toolbar-duplicate-actions [data-role=\"confirm\"] {\n border-color: #256cfb;\n background: #256cfb;\n color: #fff;\n}\n\n.sear-cell-highlight-overlay {\n position: fixed;\n inset: 0;\n z-index: 10000;\n display: grid;\n place-items: center;\n background: rgba(12, 16, 24, 0.2);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", Arial, sans-serif;\n}\n.sear-sheet-sort-overlay { position: fixed; inset: 0; z-index: 10020; display: grid; place-items: center; background: #1118; }\n.sear-sheet-filter-overlay { position: fixed; inset: 0; z-index: 10020; display: grid; place-items: center; background: #1118; }\n.sear-sheet-filter-panel { position: relative; box-sizing: border-box; width: min(400px, calc(100vw - 24px)); max-height: min(85vh, 700px); overflow: auto; padding: 20px; border: 1px solid #dfe3e9; border-radius: 6px; background: #fff; color: #202329; box-shadow: 0 18px 48px #0003; font: 14px sans-serif; }\n.sear-sheet-filter-panel h2 { margin: 0 32px 16px 0; font-size: 17px; }\n.sear-sheet-filter-close { position: absolute; top: 10px; right: 12px; width: 30px; height: 30px; border: 0; background: transparent; font-size: 22px; cursor: pointer; }\n.sear-sheet-filter-panel > label { display: flex; align-items: center; justify-content: space-between; gap: 10px; }\n.sear-sheet-filter-panel select, .sear-sheet-filter-panel input[type=\"text\"], .sear-sheet-filter-panel input[type=\"date\"], .sear-sheet-filter-panel input[type=\"search\"] { box-sizing: border-box; width: 100%; min-width: 0; height: 34px; padding: 5px 8px; border: 1px solid #cbd2da; border-radius: 4px; background: #fff; color: inherit; font: inherit; }\n.sear-sheet-filter-panel > label select { width: 75%; }\n.sear-sheet-filter-sorting { display: flex; gap: 8px; margin-top: 14px; }\n.sear-sheet-filter-sorting button { flex: 1; min-height: 32px; border: 1px solid #dfe3e9; border-radius: 4px; background: #fff; cursor: pointer; }\n.sear-sheet-filter-sorting button:hover { background: #f3f6fa; }\n.sear-sheet-filter-tabs { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 16px; border-bottom: 1px solid #dfe3e9; }\n.sear-sheet-filter-tabs button { min-height: 36px; border: 0; border-bottom: 2px solid transparent; background: transparent; cursor: pointer; }\n.sear-sheet-filter-tabs button[aria-selected=\"true\"] { border-bottom-color: #256cfb; color: #1769d2; }\n.sear-sheet-filter-body { display: grid; gap: 10px; padding-top: 14px; }\n.sear-sheet-filter-value-controls { display: flex; gap: 14px; }\n.sear-sheet-filter-value-controls button { border: 0; background: transparent; color: #1769d2; cursor: pointer; }\n.sear-sheet-filter-values { max-height: 240px; overflow: auto; border: 1px solid #e5e8ed; border-radius: 4px; }\n.sear-sheet-filter-values label { display: flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 8px; }\n.sear-sheet-filter-values label[hidden] { display: none; }\n.sear-sheet-filter-values label span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.sear-sheet-filter-values label small { color: #69717c; }\n.sear-sheet-filter-values label button { border: 0; background: transparent; color: #1769d2; cursor: pointer; }\n.sear-sheet-filter-limit { margin: 0; color: #69717c; font-size: 12px; }\n.sear-sheet-filter-panel > .sear-sheet-filter-auto { display: inline-flex; justify-content: flex-start; align-items: center; gap: 7px; margin-top: 10px; }\n.sear-sheet-filter-status { min-height: 16px; margin: 8px 0 0; color: #b42318; font-size: 12px; }\n.sear-sheet-filter-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }\n.sear-sheet-filter-actions button { min-height: 34px; padding: 0 10px; border: 1px solid #cbd2da; border-radius: 4px; background: #fff; cursor: pointer; }\n.sear-sheet-filter-actions button:last-child { border-color: #256cfb; background: #256cfb; color: #fff; }\n.sear-sheet-filter-actions button:disabled { opacity: .45; cursor: default; }\n.sear-sheet-sort-panel { position: relative; box-sizing: border-box; width: min(520px, calc(100vw - 24px)); max-height: min(80vh, 680px); overflow: auto; padding: 22px; border: 1px solid #dfe3e9; border-radius: 6px; background: #fff; color: #202329; box-shadow: 0 18px 48px #0003; font: 14px sans-serif; }\n.sear-sheet-sort-panel h2 { margin: 0 32px 18px 0; font-size: 17px; font-weight: 600; }\n.sear-sheet-sort-close { position: absolute; top: 12px; right: 14px; width: 28px; height: 28px; border: 0; background: transparent; font-size: 23px; cursor: pointer; }\n.sear-sheet-sort-header { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }\n.sear-sheet-sort-criteria { display: grid; gap: 8px; }\n.sear-sheet-sort-criterion { display: grid; grid-template-columns: 76px minmax(0, 1fr) minmax(0, 1fr) 30px; align-items: center; gap: 8px; }\n.sear-sheet-sort-criterion select, .sear-sheet-sort-criterion input { box-sizing: border-box; min-width: 0; width: 100%; height: 34px; padding: 4px 8px; border: 1px solid #cbd2da; border-radius: 4px; background: #fff; color: inherit; font: inherit; }\n.sear-sheet-sort-criterion button { width: 30px; height: 30px; border: 0; background: transparent; font-size: 20px; cursor: pointer; }\n.sear-sheet-sort-criterion button:disabled { color: #b8bec6; cursor: default; }\n.sear-sheet-sort-add { margin-top: 14px; padding: 5px 0; border: 0; background: transparent; color: #1769d2; font: inherit; cursor: pointer; }\n.sear-sheet-sort-status { min-height: 18px; margin: 8px 0 0; color: #b42318; font-size: 12px; }\n.sear-sheet-sort-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }\n.sear-sheet-sort-actions button { min-width: 72px; height: 34px; border: 1px solid #cbd2da; border-radius: 4px; background: #fff; color: inherit; font: inherit; cursor: pointer; }\n.sear-sheet-sort-actions [data-role=\"confirm\"] { border-color: #256cfb; background: #256cfb; color: #fff; }\n@media (max-width: 440px) { .sear-sheet-sort-criterion { grid-template-columns: 1fr 1fr 30px; } .sear-sheet-sort-criterion span { grid-column: 1 / -1; } }\n\n.sear-cell-highlight-panel {\n position: relative;\n box-sizing: border-box;\n width: min(440px, calc(100vw - 32px));\n max-height: calc(100vh - 32px);\n overflow: auto;\n padding: 22px;\n border: 1px solid #dfe3e8;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 18px 48px rgba(16, 24, 40, 0.18);\n color: #17181c;\n font-size: 14px;\n}\n\n.sear-cell-highlight-panel h2 { margin: 0 40px 18px 0; font-size: 18px; font-weight: 600; }\n.sear-cell-highlight-close { position: absolute; top: 14px; right: 14px; border: 0; background: none; font-size: 24px; cursor: pointer; }\n.sear-cell-highlight-panel select,\n.sear-cell-highlight-details input:not([type=\"checkbox\"]) {\n width: 100%;\n height: 34px;\n padding: 0 9px;\n border: 1px solid #cbd2da;\n border-radius: 4px;\n background: #fff;\n color: inherit;\n font: inherit;\n}\n.sear-cell-highlight-details { display: grid; gap: 10px; margin-top: 12px; }\n.sear-cell-highlight-details input[hidden] { display: none; }\n.sear-cell-highlight-details label { display: flex; align-items: center; gap: 8px; min-height: 28px; cursor: pointer; }\n.sear-cell-highlight-details input[type=\"checkbox\"] { width: 16px; height: 16px; margin: 0; accent-color: #256cfb; }\n.sear-cell-highlight-styles { margin: 18px 0 0; padding: 0; border: 0; }\n.sear-cell-highlight-styles legend { margin-bottom: 8px; }\n.sear-cell-highlight-styles label { display: flex; align-items: center; gap: 9px; min-height: 32px; cursor: pointer; }\n.sear-cell-highlight-swatch { display: inline-block; flex: none; width: 32px; height: 20px; border: 1px solid #cbd2da; border-radius: 2px; }\n.sear-cell-highlight-swatch.redFill { background: #fbc8cf; }\n.sear-cell-highlight-swatch.yellowFill { background: #fce3a1; }\n.sear-cell-highlight-swatch.greenFill { background: #c9edd1; }\n.sear-cell-highlight-swatch.redBorder { border: 2px solid #bc0e1d; }\n.sear-cell-highlight-swatch.redText { position: relative; }\n.sear-cell-highlight-swatch.redText::after { content: \"A\"; display: block; color: #be0e1e; text-align: center; line-height: 18px; }\n.sear-cell-highlight-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }\n.sear-cell-highlight-actions button { min-width: 72px; height: 34px; border: 1px solid #cbd2da; border-radius: 4px; background: #fff; color: inherit; font: inherit; cursor: pointer; }\n.sear-cell-highlight-actions [data-role=\"confirm\"] { border-color: #256cfb; background: #256cfb; color: #fff; }\n.sear-cell-highlight-list { min-height: 100px; max-height: 300px; overflow: auto; margin-top: 12px; border-top: 1px solid #e6e9ed; }\n.sear-cell-highlight-list p { color: #737984; }\n.sear-cell-highlight-rule { display: flex; align-items: center; gap: 10px; min-height: 44px; border-bottom: 1px solid #e6e9ed; }\n.sear-cell-highlight-rule span:first-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.sear-cell-highlight-rule span.sear-validation-rule-summary { overflow: visible; white-space: pre-line; overflow-wrap: anywhere; line-height: 18px; padding: 6px 0; }\n.sear-cell-highlight-rule button { width: 28px; height: 28px; border: 0; background: transparent; font-size: 19px; cursor: pointer; }\n.sear-validation-panel { width: min(440px, calc(100vw - 24px)); }\n.sear-validation-feedback { position: fixed; z-index: 9999; display: flex; align-items: flex-start; gap: 10px; width: min(270px, calc(100vw - 16px)); padding: 12px 14px; background: #fff; color: #30343a; border: 1px solid #e8eaed; border-radius: 7px; box-shadow: 0 3px 12px rgba(0, 0, 0, .12); pointer-events: none; box-sizing: border-box; }\n.sear-validation-feedback__icon { display: grid; place-items: center; flex: 0 0 27px; width: 27px; height: 27px; border-radius: 50%; background: #ff873d; color: #fff; font-weight: 700; }\n.sear-validation-feedback strong { display: block; margin: 0 0 2px; color: #fa5b2d; font-size: 15px; line-height: 22px; }\n.sear-validation-feedback__message { margin: 0; font-size: 14px; line-height: 21px; overflow-wrap: anywhere; }\n.sear-validation-feedback--hint { border-left: 3px solid #4b718f; }\n.sear-validation-feedback--hint .sear-validation-feedback__icon { display: none; }\n.sear-validation-feedback--hint strong { color: #365b77; }\n.sear-validation-tabs { display: flex; gap: 6px; margin-bottom: 16px; border-bottom: 1px solid #e6e9ed; }\n.sear-validation-tabs button { min-height: 34px; padding: 0 10px; border: 0; background: transparent; color: #26313d; cursor: pointer; }\n.sear-validation-tabs button[aria-selected=\"true\"] { color: #12559a; box-shadow: inset 0 -2px #2b76d2; font-weight: 600; }\n.sear-validation-tabs button:focus-visible { outline: 2px solid #2b76d2; outline-offset: -2px; }\n.sear-validation-fields { display: grid; gap: 12px; }\n.sear-validation-fields[hidden], .sear-validation-field[hidden], .sear-validation-fields label[hidden] { display: none; }\n.sear-validation-field { display: grid; gap: 5px; color: #28313b; }\n.sear-validation-field input, .sear-validation-field select, .sear-validation-option input:not([type=\"color\"]) {\n box-sizing: border-box; width: 100%; min-width: 0; height: 34px; padding: 4px 8px;\n border: 1px solid #cbd2da; border-radius: 4px; background: #fff; color: #17181c; font: inherit;\n}\n.sear-validation-fields > label:not(.sear-validation-field) { display: flex; align-items: center; gap: 7px; }\n.sear-validation-options { display: grid; gap: 8px; max-height: 180px; overflow: auto; }\n.sear-validation-options[hidden], .sear-validation-fields > button[hidden] { display: none; }\n.sear-validation-option { display: grid; grid-template-columns: minmax(0, 1fr) 34px 28px; align-items: center; gap: 6px; }\n.sear-validation-option input[type=\"color\"] { width: 34px; height: 30px; padding: 2px; border: 1px solid #cbd2da; border-radius: 4px; }\n.sear-validation-option button { width: 28px; height: 28px; border: 0; background: transparent; font-size: 20px; cursor: pointer; }\n.sear-validation-fields > button { justify-self: start; border: 0; background: transparent; color: #1769d2; cursor: pointer; }\n.sear-validation-panel .sear-cell-highlight-rule button { width: auto; min-width: 28px; padding: 0 4px; font-size: 13px; }\n.sear-cell-data-visual-panel { max-height: min(80vh, 720px); overflow: auto; }\n.sear-cell-data-visual-field { display: grid; grid-template-columns: 108px minmax(0, 1fr) auto; align-items: center; gap: 8px; margin: 10px 0; }\n.sear-cell-data-visual-field select { min-width: 0; }\n.sear-cell-data-visual-field input[type=\"number\"] { width: 86px; min-width: 0; padding: 7px; border: 1px solid #cbd2da; border-radius: 4px; }\n.sear-cell-data-visual-field input[type=\"color\"] { width: 44px; height: 30px; padding: 1px; border: 1px solid #cbd2da; background: #fff; cursor: pointer; }\n.sear-cell-data-visual-field[hidden] { display: none; }\n.sear-freeze-menu { position: fixed; z-index: 10025; box-sizing: border-box; width: 212px; max-height: calc(100vh - 16px); overflow-y: auto; padding: 5px 0; background: #fff; color: #25272d; border: 1px solid #dedfe3; border-radius: 6px; box-shadow: 0 8px 22px rgba(0, 0, 0, .16); }\n.sear-freeze-menu button { display: block; width: 100%; min-height: 34px; padding: 7px 14px; border: 0; background: transparent; color: inherit; font: 13px/20px inherit; text-align: left; white-space: nowrap; cursor: pointer; }\n.sear-freeze-menu button:hover:not(:disabled), .sear-freeze-menu button:focus-visible { background: #f1f5fb; outline: 0; }\n.sear-freeze-menu button:disabled { color: #a5a7ad; cursor: default; }\n.sear-freeze-menu__divider { height: 1px; margin: 5px 0; background: #e8e9ec; }\n"

CSS injected by SearWebToolbar for the web toolbar and its popovers.

classHeadlessToolbar
class HeadlessToolbar extends SearToolbar

Toolbar implementation for hosts without a UI surface.

constructorHeadlessToolbar(): HeadlessToolbar
propertyreadonly symbol: symbolstatic

DI token for resolving HeadlessToolbar.

methoddestroy(): void

Releases resources owned by SearToolbar.

methodmount(_target: unknown): void

Attaches this adapter to its host surface.

classSearToolbar

Platform-neutral toolbar lifecycle contract.

constructorSearToolbar(): SearToolbar
propertyreadonly symbol: symbolstatic

DI token for resolving SearToolbar.

methoddestroy(): void

Releases resources owned by SearToolbar.

methodmount(target: unknown): void

Attaches this adapter to its host surface.