import { LitElement } from "lit";
import { ScaleType, Interpolator, ChangedProps, TickFormatter } from "./types";
/**
 * @tagname color-legend
 * @summary A custom element that renders a legend suitable for use with data visualizations.
 *
 * @slot subtitle - content to display below the main title
 * @slot footer - content to display under the legend color bar or items
 *
 * @cssproperty [--cle-font-family = sans-serif] Font used for tick and legend item text
 * @cssproperty [--cle-font-family-title = var(--cle-font-family)] Font used for the legend's title text
 * @cssproperty [--cle-font-size = 0.75rem] Font size for the tick and legend item text
 * @cssproperty [--cle-font-size-title = 0.875rem] Font size for the legend title text
 * @cssproperty [--cle-letter-spacing = 0.3px] Letter spacing for tick and legend item text
 * @cssproperty [--cle-letter-spacing-title = 0.25px] Letter spacing for the legend title text
 * @cssproperty [--cle-font-weight = 400] Font weight for the tick and legend item text
 * @cssproperty [--cle-font-weight-title = 500] Font weight for the title text
 * @cssproperty [--cle-color = currentColor] Font color for all text and tick lines
 * @cssproperty [--cle-background = #fff] Background color for the legend
 * @cssproperty [--cle-padding = 0.375rem] Padding in the legend's container div
 * @cssproperty [--cle-border = none] Border style of the legend's container div
 * @cssproperty [--cle-border-radius = 0] Border radius of the legend's container div
 * @cssproperty [--cle-box-sizing = content-box] Box-sizing property of the legend's container div
 * @cssproperty [--cle-columns = 2] Number of columns for categorical legends
 * @cssproperty [--cle-column-width = auto] Column width for categorical legends
 * @cssproperty [--cle-item-margin = 0.375rem 0.75rem 0 0] Margin property for categorical legend items
 * @cssproperty [--cle-line-width = 24px] Width of the "line" markType for categorical legends
 * @cssproperty [--cle-line-height = 2px] Height of the "line" markType for categorical legends
 * @cssproperty [--cle-swatch-size = 10px] Height & Width of "rect" and "circle" markTypes for categorical legends
 * @cssproperty [--cle-swatch-width = var(--cle-swatch-size)] Width of the "rect" and "circle" markTypes for categorical legends
 * @cssproperty [--cle-swatch-height = var(--cle-swatch-size)] Height of the "rect" and "circle" markTypes for categorical legends
 * @cssproperty [--cle-swatch-margin = 0 0.5rem 0 0] Margin of the mark (line, square, circle) for categorical legends
 **/
export declare class ColorLegendElement extends LitElement {
    static styles: import("lit").CSSResult[];
    /**
     * The title text that displays at the top of the legend
     */
    titleText: string;
    /**
     * The width of the SVG or categorical legend div element
     */
    width: number;
    /**
     * The height of the SVG element
     */
    height: number;
    /**
     * The spacing between the legend bar and top most extent of the SVG
     */
    marginTop: number;
    /**
     * The spacing between the legend bar and right most extent of the SVG
     */
    marginRight: number;
    /**
     * The spacing between the legend bar and bottom most extent of the SVG
     */
    marginBottom: number;
    /**
     * The spacing between the legend bar and left most extent of the SVG
     */
    marginLeft: number;
    /**
     * The type of legend to render based on d3-scale
     */
    scaleType: ScaleType;
    /**
     * The color scale's domain values
     */
    domain: number[] | string[];
    /**
     * The color scale's range values
     */
    range: string[];
    /**
     * The symbology used for categorical legends
     */
    markType: import("./types").MarkType;
    /**
     * The desired number of axis ticks
     */
    ticks: number;
    /**
     * The d3-format specifier to format axis tick values
     */
    tickFormat: string;
    /**
     * The size or length of the axis ticks
     */
    tickSize: number;
    /**
     * The explicit values to be used for axis ticks
     */
    tickValues: number[];
    /**
     * @ignore
     * Reference to the SVG node
     */
    svg: SVGSVGElement;
    /**
     * @ignore
     * a color interpolator function such as one from d3-scale-chromatic
     */
    private _interpolator;
    /**
     * a color interpolator function such as one from d3-scale-chromatic
     */
    get interpolator(): Interpolator<string>;
    set interpolator(value: Interpolator<string>);
    /**
     * @ignore
     * Function that formats the xAxis tick values, set internally but may also be set externally
     */
    private _tickFormatter;
    /**
     * Function that formats the xAxis tick values, set internally but may also be set externally
     */
    get tickFormatter(): TickFormatter;
    set tickFormatter(value: TickFormatter);
    /**
     * @ignore
     * Handles configuring the colorScale
     */
    private colorScaleSetter;
    /**
     * @ignore
     * A type of d3-scale for applying color values to the legend item(s),
     * set internally by the colorScaleSetter.
     */
    get colorScale(): import("./types").ColorScale;
    /**
     * @ignore
     * Configures the x scale and axis ticks
     */
    private axisTickSetter;
    /**
     * @ignore
     * A d3 linear scale used for generating axis ticks,
     * set internally by the axisTickSetter
     */
    get xScale(): import("./types").XScale;
    /**
     * @ignore
     * Handles rendering of HTML/SVG markup from the scaleType
     */
    private renderer;
    /**
     * Invoked on each update to perform rendering tasks. This method may return any
     * value renderable by lit-html's ChildPart - typically a TemplateResult
     * @returns TemplateResult
     */
    render(): import("lit-html").TemplateResult<1>;
    /**
     * Lit lifecycle method that is called before an update to the component's DOM
     * @param changedProps: ChangedProps
     */
    willUpdate(changedProps: ChangedProps): void;
}
declare global {
    interface HTMLElementTagNameMap {
        "color-legend": ColorLegendElement;
    }
}
//# sourceMappingURL=color-legend-element.d.ts.map