import type MapView from "../../views/MapView.js";
import type { EventedAccessor } from "../../core/Evented.js";
import type { DirectionalPadAngle, Vector } from "./types.js";
import type { GoTo, GoToProperties } from "../support/GoTo.js";

export interface DirectionalPadViewModelProperties extends GoToProperties, Partial<Pick<DirectionalPadViewModel, "disabled" | "rotation" | "view">> {}

export type DirectionalPadViewModelState = "ready" | "disabled" | "moving";

/**
 * Provides the logic for the [DirectionalPad](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-DirectionalPad.html) widget and [component](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-directional-pad/).
 *
 * @since 4.29
 * @see [DirectionalPad](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-DirectionalPad.html) widget - _Deprecated since 4.32. Use the [DirectionalPad component](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-directional-pad/) instead._
 * @see [Directional Pad component](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-directional-pad/)
 * @see
 * [Programming patterns: Widget viewModel pattern](https://developers.arcgis.com/javascript/latest/programming-patterns/#widget-viewmodel-pattern)
 *
 * > [!WARNING]
 * >
 * > The DirectionalPad widget is not supported in 3d.
 */
export default class DirectionalPadViewModel extends DirectionalPadViewModelSuperclass {
  constructor(properties?: DirectionalPadViewModelProperties);
  /**
   * The closest angle that matches the current mouse position
   * relative to the widget's center. There are eight possible angles, `-45`, `0`, `45`, `-90`, `90`, `-135`, `180`, and `135`. If the widget is not in motion, the value is `undefined`.
   */
  get angle(): DirectionalPadAngle | null | undefined;
  /**
   * Indicates whether interaction is allowed on the widget. When `true`, this property sets the widget to a disabled state to stop user interaction.
   *
   * @default false
   */
  accessor disabled: boolean;
  /**
   * The angle of rotation of the map. Ranges from 0 to 360
   *
   * @default 0
   * @example
   * reactiveUtils.watch(
   *  ()=>directionalPadViewModel.rotation,
   *  (newAngle,oldAngle)=> console.log({ newAngle, oldAngle })
   * );
   */
  accessor rotation: number;
  /** The state of the view model. */
  get state(): DirectionalPadViewModelState;
  /**
   * The view which the directional pad will control. If not provided, you
   * can manually listen to emitted events and control the map accordingly.
   */
  accessor view: MapView | null | undefined;
  /**
   * Starts movement in the correct direction according to pointer
   * location, and listens for pointer move (to change direction) or release
   * (to stop movement)
   *
   * This method should be called in response to pointerdown event on a button
   *
   * @param pointerLocation - Current pointer location
   * @param widgetCenter - The center of the DirectionalPad widget
   * @example
   * moveLeftButton.addEventListener("pointerDown", (event) => {
   *   const { x, y, width, height } = buttonsContainer.getBoundingClientRect();
   *   const widgetCenter = { x: x + width / 2, y: y + height / 2 };
   *   directionalPadViewModel.beginFollowingPointer(event, widgetCenter);
   * });
   */
  beginFollowingPointer(pointerLocation: Vector & Partial<Pick<PointerEvent, "target">>, widgetCenter: Vector): void;
  /**
   * Initialize a brief movement in a desired direction
   *
   * @param angle - Angle in the [0, 360] range
   * @example
   * moveLeftButton.addEventListener("keydown", () => {
   *   directionalPadViewModel.moveOnce(90);
   * });
   */
  moveOnce(angle: number): void;
}
declare const DirectionalPadViewModelSuperclass: typeof EventedAccessor & typeof GoTo