import { HTMLTemplateResult } from "lit"; import { DecisionOptions } from "../../models/decisions/decision"; import { EnumValue } from "../../helpers/types/advancedTypes"; /** The positions that task meter segment tooltips can be placed in. */ export declare enum TaskMeterTooltipPlacement { TOP = "top", BOTTOM = "bottom", LEFT = "left", RIGHT = "right" } /** The type of task that a task meter segment represents. */ export type TaskMeterSegmentKind = "verification" | "classification" | "new-tag"; /** The decision state that a task meter segment is displaying. */ export type TaskMeterSegmentState = EnumValue | "not-required" | "undecided"; declare const TaskMeterComponent_base: import("../../helpers/types/mixins").Component & { tagName: string; }; /** * @description * A component to display what decisions have been applied to a subject and if * there are any outstanding decisions. * * The host has a default height and minimum width, both of which can be * overridden with regular CSS or inherited custom properties. Segments shrink * to fit the host; gaps collapse below the preferred segment width, and * internal separators disappear below approximately 0.75em per segment. * Outlines are drawn inside the meter. * * Segments expose data-kind, data-decision, and (when present) data-tag. * CSS-generated text or emoji can use these attributes and combine part names * to target a specific task and state. No segment text is visible by default; * the accessible summary describes all decisions independently of these styles. * * @example * ```html * * ``` * * @example * ```css * oe-task-meter { * height: 1.75em; * } * oe-task-meter::part(segment) { * display: flex; * align-items: center; * justify-content: center; * overflow: hidden; * white-space: nowrap; * } * oe-task-meter::part(segment)::after { * content: attr(data-decision); * } * oe-task-meter::part(verification true)::after { * content: "\2705"; * } * ``` * * @csspart meter - The container that holds every segment * @csspart segment - Every segment in the meter * @csspart verification - Segments that represent a verification task * @csspart classification - Segments that represent a classification task * @csspart new-tag - Segments that represent a new tag (tag correction) task * @csspart true - Segments with a "true" decision * @csspart false - Segments with a "false" decision * @csspart unsure - Segments with an "unsure" decision * @csspart skip - Segments with a "skip" decision * @csspart not-required - Segments whose decision is not required * @csspart undecided - Segments that do not have a decision yet * * @cssproperty [--oe-task-meter-height=0.8rem] - The host height, inherited by the meter inside the shadow root * @cssproperty [--oe-task-meter-gap=0px] - A preferred CSS gap length, reduced when segments would become too narrow * @cssproperty [--oe-task-meter-rounding=var(--oe-border-rounding)] - The corner radius of the meter * @cssproperty [--oe-task-meter-border-width=var(--oe-border-width)] - The width of the meter outline and separators * @cssproperty [--oe-task-meter-border-color=var(--oe-border-color)] - The color of the meter outline and separators * @cssproperty [--oe-task-meter-segment-min-width=0.5em] - The preferred segment minimum; gaps collapse before segments shrink further * @cssproperty [--oe-task-meter-min-width=1em] - The host minimum width * @cssproperty [--oe-task-meter-min-height=0.5em] - The host minimum height */ export declare class TaskMeterComponent extends TaskMeterComponent_base { static styles: import("lit").CSSResult; /** Disables the tooltips that describe each segment's decision. */ disableTooltips: boolean; /** * Where the segment tooltips are positioned relative to the meter. * @values "top" | "bottom" | "left" | "right" * @default "top" */ tooltipPlacement: TaskMeterTooltipPlacement; private tile?; private injector; private segmentState; private segmentColor; private classificationSegment; private verificationSegment; private newTagSegment; private segments; private accessibleSummary; private segmentTemplate; render(): HTMLTemplateResult; } declare global { interface HTMLElementTagNameMap { "oe-task-meter": TaskMeterComponent; } } export {};