import { TemplateResult } from 'lit'; import { BahtElement } from '../base.js'; import { ButtonSize, ButtonVariant } from './baht-button.js'; import { MenuItem } from '../menu-controller.js'; export type { MenuItem } from '../menu-controller.js'; /** * Split button: a main action plus a ▾ toggle that opens a menu of related actions * (NOTES 2026-10-31). Each action can carry a keyboard `shortcut` — the main one shows * in the main button's tooltip, item ones as a right-aligned hint in the menu — and all * of them are bound document-wide (same scoping as ``). * * * el.items = [{ value: 'save-close', label: 'Save and close', shortcut: 'shift+alt+s' }]; * el.addEventListener('baht-click', save); * el.addEventListener('baht-select', (e) => run(e.detail.value)); * * Keyboard: ↓ / Enter / Space on the toggle opens on the first item, ↑ on the last; * in the menu ↑ ↓ (wrapping, skipping disabled) · Home · End · Enter/Space picks · * Escape closes back to the toggle (and is marked handled, so a surrounding * `` stays open) · Tab closes and moves on. A click outside closes. * * @fires baht-click - The main action was activated (click or its shortcut). * @fires baht-select - A menu item was picked. `detail: { value, item }`. */ export declare class BahtSplitButton extends BahtElement { /** Main action label. */ label: string; variant: ButtonVariant; size: ButtonSize; disabled: boolean; /** Shortcut for the main action, e.g. `alt+s` (see ``). */ shortcut: string; /** Menu entries. Set as a property: `el.items = [...]`. */ items: MenuItem[]; /** Menu edge aligned with the button: `'end'` (default, right in LTR) or `'start'`. */ align: 'start' | 'end'; /** Accessible name of the ▾ toggle. Defaults to the localized "More actions". */ menuLabel: string; private readonly menu; private get menuId(); protected updated(changed: Map): void; protected render(): TemplateResult; }