import { ComponentDidLoad } from '../../stencil-public-runtime';
import { HTMLStencilElement } from '../../stencil-public-runtime';
import { PredefinedColor } from '../../utils/theme';
/**
 * @since 1.0
 * @status stable
 * @reactive
 *
 * @slot info - Content to place in the gauge's information dialog. Information button is added to the gauge. (optional)
 *
 * @part header - The gauge header.
 * @part header-icon - The gauge header icon.
 * @part info-button - The gauge header info button.
 * @part value - The gauge value.
 * @part units - The gauge units.
 */
export declare class FlowGauge implements ComponentDidLoad {
  private infoDialog;
  el: HTMLStencilElement;
  private currentIcon;
  /**
   * The color of the gauge value. Colors are taken from the application palette.
   */
  color?: PredefinedColor;
  /**
   * The transition duration in milliseconds for the animation between numeric values.
   * Set to zero to disable animation.
   */
  duration: number;
  /**
   * The Flo.w context ID to use for application state.
   */
  flowContext: string;
  /**
   * The display format of the gauge value. Use a D3 format string for numeric values. Use `"icon"` to
   * treat `value` as an icon name.
   */
  format?: string;
  /**
   * The gauge heading text.
   */
  heading?: string;
  /**
   * Set to display an icon in the gauge heading. The property can be the name of
   * a built-in icon, a URL to an SVG file, or an SVG data URI.
   */
  icon?: string;
  /**
   * The units text to display under the gauge value.
   */
  units?: string;
  /**
   * The gauge value specified as a Flo.w reactive expression.
   *
   * @reactive
   */
  value?: string;
  componentDidLoad(): Promise<void>;
  disconnectedCallback(): Promise<void>;
  private infoClicked;
  private handleDataChanged;
  render(): any;
}