/// <reference path="../../index.d.ts" />
/// <reference types="@arcgis/core/interfaces.d.ts" />
import type { PublicLitElement as LitElement } from "@arcgis/lumina/PublicLitElement";

/**
 * @cssproperty [--arcgis-ticks-tick-length] - Specifies the length of the ticks.
 * @cssproperty [--arcgis-ticks-tick-color] - Specifies the color of the ticks.
 * @cssproperty [--arcgis-ticks-gap] - Specifies the gap between the ticks and labels.
 */
export abstract class ArcgisTicks extends LitElement {
  /**
   * When `true`, the component will allow clicking on ticks.
   *
   * @default false
   */
  accessor interactive: boolean;
  /**
   * The exponent used to interpolate the position of ticks along the component.
   * A value of `0` indicates linear interpolation. Positive values indicate exponential interpolation, and negative values indicate logarithmic interpolation.
   *
   * Set this property when the range of values is large and users need precision in the lower range of values (for an exponential interpolation), or in the higher range (for a logarithmic interpolation).
   *
   * ```tsx
   * <arcgis-ticks interpolation-exponent={14} min={1} max={5518000} mode="value" values={[1, 11500, 5518000]} />
   * ```
   *
   * @default 0
   */
  accessor interpolationExponent: number;
  /** A function used to format each tick's label. */
  accessor labelFormatter: ((value: number, defaultFormatter: (value: number) => string) => nullish | string) | undefined;
  /**
   * Determines whether the labels are placed before or after the ticks.
   *
   * @default "trailing"
   */
  accessor labelPlacement: "leading" | "trailing";
  /**
   * Determines the layout/orientation of the component.
   *
   * @default "horizontal"
   */
  accessor layout: Layout;
  /**
   * The component's maximum rendered value.
   *
   * @default 100
   */
  accessor max: number;
  /**
   * The component's minimum rendered value.
   *
   * @default 0
   */
  accessor min: number;
  /**
   * When `true`, the values are displayed from high to low.
   *
   * @default false
   */
  accessor mirrored: boolean;
  /**
   * The mode or method of positioning ticks along the component. It drives how [values](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#values) is interpreted.
   * - `count`: Places a fixed number of ticks (provided in the [values](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#values) property) at equal distances from each other.
   * - `percent`: [values](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#values) is interpreted as percentage. If [values](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#values) is a number, it indicates the interval between ticks. If it is an array, it indicates the percentage values at which to place the ticks.
   * - `value`: Indicates that ticks will only be placed at the values specified in the property.
   *
   * @default "count"
   * @see [values](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#values)
   */
  accessor mode: TickMode;
  /**
   * Indicates whether to render a line connecting the ticks.
   *
   * @default false
   */
  accessor showBaseline: boolean;
  /**
   * Indicates whether to render labels for the ticks.
   *
   * @default false
   */
  accessor showLabels: boolean;
  /**
   * Indicates where ticks will be rendered along the component.
   * See the description for [mode](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#mode) for more information about how this property is interpreted by each mode.
   *
   * @see [mode](https://developers.arcgis.com/javascript/latest/references/common-components/arcgis-ticks/#mode)
   */
  accessor values: TickValues;
  /** Fires when the user clicks on one of the ticks. */
  readonly arcgisTickClick: import("@arcgis/lumina").TargetedEvent<this, { value: number; }>;
  readonly "@eventTypes": {
    arcgisTickClick: ArcgisTicks["arcgisTickClick"]["detail"];
  };
}

export type Layout = "horizontal" | "vertical";

export type TickMode = "count" | "percent" | "value";

export type TickValues = number[] | number;