import React from "react"; export declare const toolbarIcons: { readonly bold: import("react/jsx-runtime").JSX.Element; readonly italic: import("react/jsx-runtime").JSX.Element; readonly underline: import("react/jsx-runtime").JSX.Element; readonly strikethrough: import("react/jsx-runtime").JSX.Element; readonly code: import("react/jsx-runtime").JSX.Element; readonly superscript: import("react/jsx-runtime").JSX.Element; readonly subscript: import("react/jsx-runtime").JSX.Element; readonly textColor: import("react/jsx-runtime").JSX.Element; readonly backgroundColor: import("react/jsx-runtime").JSX.Element; readonly fontSize: import("react/jsx-runtime").JSX.Element; readonly fontFamily: import("react/jsx-runtime").JSX.Element; readonly paragraphStyle: import("react/jsx-runtime").JSX.Element; readonly alignLeft: import("react/jsx-runtime").JSX.Element; readonly alignCenter: import("react/jsx-runtime").JSX.Element; readonly alignRight: import("react/jsx-runtime").JSX.Element; readonly alignJustify: import("react/jsx-runtime").JSX.Element; readonly quote: import("react/jsx-runtime").JSX.Element; readonly moveUp: import("react/jsx-runtime").JSX.Element; readonly moveDown: import("react/jsx-runtime").JSX.Element; readonly moveLeft: import("react/jsx-runtime").JSX.Element; readonly moveRight: import("react/jsx-runtime").JSX.Element; readonly indent: import("react/jsx-runtime").JSX.Element; readonly outdent: import("react/jsx-runtime").JSX.Element; readonly link: import("react/jsx-runtime").JSX.Element; readonly unlink: import("react/jsx-runtime").JSX.Element; readonly bulletedList: import("react/jsx-runtime").JSX.Element; readonly numberedList: import("react/jsx-runtime").JSX.Element; readonly checklist: import("react/jsx-runtime").JSX.Element; readonly checkSquare: import("react/jsx-runtime").JSX.Element; readonly restart: import("react/jsx-runtime").JSX.Element; readonly continueNumbering: import("react/jsx-runtime").JSX.Element; readonly table: import("react/jsx-runtime").JSX.Element; readonly mergeCells: import("react/jsx-runtime").JSX.Element; readonly splitCell: import("react/jsx-runtime").JSX.Element; readonly addRow: import("react/jsx-runtime").JSX.Element; readonly addColumn: import("react/jsx-runtime").JSX.Element; readonly headerRow: import("react/jsx-runtime").JSX.Element; readonly deleteTable: import("react/jsx-runtime").JSX.Element; readonly image: import("react/jsx-runtime").JSX.Element; readonly video: import("react/jsx-runtime").JSX.Element; readonly audio: import("react/jsx-runtime").JSX.Element; readonly formula: import("react/jsx-runtime").JSX.Element; readonly specialChar: import("react/jsx-runtime").JSX.Element; readonly cellBorder: import("react/jsx-runtime").JSX.Element; readonly edit: import("react/jsx-runtime").JSX.Element; readonly zoomIn: import("react/jsx-runtime").JSX.Element; readonly zoomOut: import("react/jsx-runtime").JSX.Element; readonly delete: import("react/jsx-runtime").JSX.Element; readonly import: import("react/jsx-runtime").JSX.Element; readonly saveCopy: import("react/jsx-runtime").JSX.Element; readonly json: import("react/jsx-runtime").JSX.Element; readonly history: import("react/jsx-runtime").JSX.Element; readonly addComment: import("react/jsx-runtime").JSX.Element; readonly comments: import("react/jsx-runtime").JSX.Element; readonly suggest: import("react/jsx-runtime").JSX.Element; readonly suggestions: import("react/jsx-runtime").JSX.Element; readonly showEdits: import("react/jsx-runtime").JSX.Element; readonly undo: import("react/jsx-runtime").JSX.Element; readonly redo: import("react/jsx-runtime").JSX.Element; readonly more: import("react/jsx-runtime").JSX.Element; readonly divider: import("react/jsx-runtime").JSX.Element; readonly pageBreak: import("react/jsx-runtime").JSX.Element; readonly lineHeight: import("react/jsx-runtime").JSX.Element; }; export type ToolbarIconKey = keyof typeof toolbarIcons; /** A single always-visible toolbar control: icon + plain-language label together, per the redesign's core principle. */ export declare function ToolbarButton({ icon, label, ariaLabel, pressed, disabled, title, onClick, iconOnly, widePromote, narrowIconOnly }: { icon: ToolbarIconKey; label: string; ariaLabel?: string; /** "mixed" renders aria-pressed="mixed" - the selection is partially covered by this mark (see markCoverage in CanonicalAuthorityEditor.tsx). */ pressed?: boolean | "mixed"; disabled?: boolean; title?: string; onClick: (event: React.MouseEvent) => void; /** Only for genuinely space-constrained spots (e.g. a 4-way align cluster) - the accessible name is preserved via ariaLabel/label regardless. */ iconOnly?: boolean; /** * This is the wide-viewport standalone copy of a tool that also lives in a * dropdown (via the matching `widePromote` ToolbarMenuItem below) - hidden * by default, shown only past theme.ts's wide-promotion breakpoint. See * docs/bugs/toolbar-priority-collapse-fixed-threshold-no-wide-promotion.md. */ widePromote?: boolean; /** * Unlike `iconOnly` (always icon-only), this drops the label text only * below theme.ts's 479px container-width breakpoint - the button shows * icon + label at every wider width, matching every other always-visible * button, and falls back to icon-only (title/aria-label still carry the * name, so it stays a real tooltip) only once space is genuinely tight. * A CSS-only toggle (see `[data-srte-narrow-icon-only]` in theme.ts), not * JS viewport state, matching how every other responsive tier here works. */ narrowIconOnly?: boolean; }): import("react/jsx-runtime").JSX.Element; /** One row inside an open dropdown menu - closes the dropdown after acting, matching ContextMenu.tsx's own dismiss-on-action convention. */ export declare function ToolbarMenuItem({ icon, label, ariaLabel, pressed, disabled, title, onClick, widePromote }: { icon?: ToolbarIconKey; label: string; ariaLabel?: string; pressed?: boolean | "mixed"; disabled?: boolean; title?: string; onClick: (event: React.MouseEvent) => void; /** This tool also has a standalone wide-viewport ToolbarButton copy - hide this dropdown/mobile-menu row once that copy is showing (see ToolbarButton's own doc comment). */ widePromote?: boolean; }): import("react/jsx-runtime").JSX.Element; /** * A labeled dropdown for a group's long-tail tools - wires up the * `.srte-toolbar-menu`/`.srte-menu` CSS `theme.ts` already defines but the * pre-redesign toolbar never used. `
/` gives free * keyboard support (Enter/Space to open, native focus handling) without a * new open/close state to manage; outside-click dismiss is handled by * useDismissDetailsOnOutsideClick above. * * The panel itself renders `position: fixed` with JS-measured coordinates * (docs/bugs/toolbar-dropdown-clipped-by-host-overflow-hidden.md), the same * pattern ColorPickerPopover/TableBorderPopover already use - a real host * can (and, reported live, does) wrap the editor in an `overflow: hidden` * container for its own layout reasons; a `position: absolute` panel * anchored inside that container gets visually clipped the moment it needs * to extend past the container's own bounds, which is exactly when a * narrow host is most likely to need the dropdown in the first place. * `position: fixed`'s containing block is normally the viewport, so this * escapes ANY ancestor's overflow clipping regardless of DOM depth - unless * an ancestor has its own transform/perspective/filter, which becomes the * containing block instead (see fixedPositioning.ts, and * docs/bugs/toolbar-menu-misplaced-inside-transformed-ancestor.md); the * placement math below accounts for that case too. */ export declare function ToolbarDropdown({ icon, label, priority, children }: { icon?: ToolbarIconKey; label: string; /** Mirrors theme.ts's `[data-srte-priority]` responsive rules - 2 collapses into the mobile "More" menu before 1 (never collapses), leaving priority 3 whole *groups* to collapse first. */ priority?: 2; children: React.ReactNode; }): import("react/jsx-runtime").JSX.Element; /** A visually-separated cluster of controls, optionally collapsing as a whole unit on narrow viewports (theme.ts's `.srte-toolbar-group[data-srte-priority="3"]`). */ export declare function ToolbarGroup({ priority, children }: { priority?: 3; children: React.ReactNode; }): import("react/jsx-runtime").JSX.Element; /** * The narrow-viewport overflow trigger - `.srte-mobile-more` is CSS-hidden * except under theme.ts's `max-width: 639px` rules, which also hide every * `[data-srte-priority="2"]`/`[data-srte-priority="3"]` element. Its own * menu statically lists every tool that lives inside one of those * collapsing dropdowns/groups, so nothing becomes unreachable once the * primary row starts shedding groups - this is plain CSS visibility * toggling of pre-rendered content, not JS media-query logic, matching how * the rest of this responsive system already works. * * The panel itself renders `position: fixed` with JS-measured coordinates, * the same fix and reasoning as `ToolbarDropdown` (docs/bugs/ * toolbar-dropdown-clipped-by-host-overflow-hidden.md) - this component was * NOT covered by that fix at the time (incorrectly assumed to be * unaffected since it already had its own separate mobile CSS), but it has * the exact same `position: absolute` vulnerability to a host's own * `overflow: hidden` container, and since this is the ONLY toolbar * overflow affordance on narrow viewports (every ToolbarDropdown hides * entirely below the mobile breakpoint), a clipped host is more likely to * matter here, not less. Confirmed live: a real narrow host wrapping the * editor in `overflow: hidden` computed this panel at `left: -214px` - * mostly off-screen, functionally invisible despite being technically * present in the DOM. */ export declare function MobileMoreMenu({ children }: { children: React.ReactNode; }): import("react/jsx-runtime").JSX.Element;