import { CustomElement } from "../../internal/custom-element.js";
import { BooleanAttributeDirective } from "../../internal/utils/boolean-attribute-directive.js";
import { SlotContentObserver } from "../../internal/controllers/slot-content-observer.js";
import { TooltipPlacement, TooltipVariant } from "../tooltip/tooltip.js";
import { TooltipController } from "../tooltip/tooltip.controller.js";
import { PropertyValues, TemplateResult } from "lit";
import { OdxIconName } from "@odx/icons";
declare const ButtonDirective: BooleanAttributeDirective<"data-odx-button">;
type ButtonSize = (typeof ButtonSize)[keyof typeof ButtonSize];
declare const ButtonSize: {
  readonly SM: "sm";
  readonly MD: "md";
  readonly LG: "lg";
};
/**
 * @summary Used for components with button functionality.
 *
 * @slot - The button's label.
 * @slot prefix - Prefix slot typically used for icons. Replaced by a loading spinner while `loading` is `true` if no `suffix` content is present.
 * @slot suffix - Suffix slot typically used for icons. Replaced by a loading spinner while `loading` is `true` when populated.
 * @slot badge - Optional badge rendered as an overlay next to the label. Position is controlled by the `badgePlacement` property.
 *
 * @csspart icon - The icon element rendered when the `icon` property is set.
 *
 * @remarks
 *
 * The HTML structure of button elements generally looks like this:
 *
 * ```html
 * <div id="base">
 *   <slot name="prefix">
 *       <!-- The slot is replaced by loading spinner when loading is set to true if default loading slot is 'prefix' -->
 *   </slot>
 *   <div id="label">
 *      <slot></slot>
 *   </div>
 *   <slot name="suffix">
 *       <!-- The slot is replaced by a loading spinner when loading is set to true if default loading slot is 'suffix' -->
 *   </slot>
 * </div>
 * ```
 */
declare class ButtonBase extends CustomElement {
  #private;
  static readonly styles: import("lit").CSSResult[];
  protected readonly slots: SlotContentObserver;
  protected readonly tooltip: TooltipController;
  protected loadingSlot?: 'prefix' | 'suffix';
  /**
   * Indicates whether the element is disabled.
   * If `true` it cannot be interacted with nor be focused.
   */
  disabled: boolean;
  hint?: string | null;
  hintLoading?: string | null;
  hintPlacement?: TooltipPlacement | null;
  /** Visual variant of the hint tooltip. Defaults to `neutral`. */
  hintVariant?: TooltipVariant | null;
  /**
   * Name of the icon to render next to the label. When no slotted content is present,
   * the icon takes the place of the label entirely.
   */
  icon?: OdxIconName | null;
  /**
   * When `true`, replaces the prefix or suffix slot content with a loading spinner
   * and prevents click activation. The button reports `aria-busy="true"` while loading.
   */
  loading: boolean;
  /** Size of the button. Affects height, padding, and typography. */
  size: ButtonSize;
  get currentIcon(): OdxIconName | null | undefined;
  get currentHint(): string | null | undefined;
  constructor();
  click(): void;
  connectedCallback(): void;
  protected willUpdate(props: PropertyValues<this>): void;
  protected updated(props: PropertyValues<this>): void;
  protected render(): TemplateResult;
  protected renderContent(): TemplateResult;
  protected renderLabel(label?: TemplateResult | string): TemplateResult | string;
  protected renderSlot(name?: 'prefix' | 'suffix'): TemplateResult;
}
export { ButtonBase, ButtonDirective, ButtonSize };