import { CssLength } from '@breadstone/mosaik-themes';
import { RangeBaseElement } from '../Abstracts/RangeBaseElement';
import type { IProgressRingElementProps } from './IProgressRingElementProps';
declare const ProgressRingElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Labelable").ILabelableProps) & typeof RangeBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * ProgressRing - A circular progress indicator for displaying task completion and loading states.
 *
 * @description
 * The ProgressRing component presents progress information in an elegant circular format with
 * support for both determinate progress (specific percentage) and indeterminate loading states.
 * Features smooth SVG-based animations, customizable stroke thickness and radius, optional text
 * labels for enhanced user feedback, and comprehensive theming. Ideal for dashboards, loading
 * indicators, file operations, and any scenario where circular progress visualization provides
 * better visual feedback than linear bars.
 *
 * @name ProgressRing
 * @element mosaik-progress-ring
 * @category Ranges
 *
 * @slot label - Text label content area for progress description or percentage display
 * @slot hint - Secondary text content area for additional progress information or status
 *
 * @csspart svg - Root SVG container for the progress ring
 * @csspart bar - Background circle/track element for the progress ring
 * @csspart fill - Progress circle/path indicating current completion level
 * @csspart indeterminate - Animated circle for indeterminate loading state
 * @csspart label - Text label styling container for progress information
 * @csspart hint - Hint text styling container for additional information
 *
 * @cssprop {String} --progress-ring-font-family - Font family for progress text labels
 * @cssprop {String} --progress-ring-font-size - Font size for progress text
 * @cssprop {String} --progress-ring-font-weight - Font weight for progress text
 * @cssprop {String} --progress-ring-padding-top - Top padding for ring container
 * @cssprop {String} --progress-ring-padding-right - Right padding for ring container
 * @cssprop {String} --progress-ring-padding-bottom - Bottom padding for ring container
 * @cssprop {String} --progress-ring-padding-left - Left padding for ring container
 * @cssprop {String} --progress-ring-gap - Spacing between ring and label elements
 * @cssprop {String} --progress-ring-transition-duration - Animation duration for progress changes
 * @cssprop {String} --progress-ring-transition-mode - Animation easing mode for progress transitions
 * @cssprop {String} --progress-ring-transition-property - CSS properties to animate during transitions
 * @cssprop {String} --progress-ring-foreground-color - Primary color for ring stroke and text
 * @cssprop {String} --progress-ring-background-color - Background color for the ring container
 * @cssprop {String} --progress-ring-border-color - Border color for ring container styling
 * @cssprop {String} --progress-ring-border-width - Border width for ring container
 * @cssprop {String} --progress-ring-border-radius - Border radius for container styling
 * @cssprop {String} --progress-ring-border-style - Border style for ring container
 * @cssprop {String} --progress-ring-shadow - Drop shadow or elevation effect for the progress ring
 * @cssprop {String} --progress-ring-fill-color - Fill color for the progress indicator arc
 * @cssprop {String} --progress-ring-track-color - Background track color for the ring
 * @cssprop {String} --progress-ring-size - Overall size dimensions for the progress ring
 * @cssprop {String} --progress-ring-stroke-width - Thickness of the progress ring stroke/arc
 *
 * @dependency {TextElement} - For rendering progress labels and text content
 *
 * @fires rangeValueChanged {RangeValueChangedEvent} - Fired when the progress value changes
 *
 * @example
 * Simple progress ring with percentage:
 * ```html
 * <mosaik-progress-ring value="65" max="100">
 *   <mosaik-text slot="label">65%</mosaik-text>
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * File upload progress with status:
 * ```html
 * <mosaik-progress-ring value="42" max="100">
 *   <mosaik-text slot="label">42%</mosaik-text>
 *   <mosaik-text slot="hint">Uploading...</mosaik-text>
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * Indeterminate loading ring:
 * ```html
 * <mosaik-progress-ring is-indeterminate>
 *   <mosaik-text slot="label">Loading</mosaik-text>
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * Task completion ring with custom variant:
 * ```html
 * <mosaik-progress-ring value="8" max="10" variant="success">
 *   <mosaik-text slot="label">8/10</mosaik-text>
 *   <mosaik-text slot="hint">Tasks Complete</mosaik-text>
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * Small loading spinner for buttons:
 * ```html
 * <mosaik-progress-ring
 *   is-indeterminate
 *   radius="12"
 *   thickness="2">
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * Custom styled download progress:
 * ```html
 * <mosaik-progress-ring
 *   value="75"
 *   max="100"
 *   radius="60"
 *   thickness="8"
 *   variant="info">
 *   <mosaik-text slot="label">75%</mosaik-text>
 *   <mosaik-text slot="hint">Download Progress</mosaik-text>
 * </mosaik-progress-ring>
 * ```
 *
 * @example
 * Dashboard metric with large ring:
 * ```html
 * <mosaik-progress-ring
 *   value="92"
 *   max="100"
 *   radius="80"
 *   thickness="12"
 *   variant="primary">
 *   <div slot="label" style="text-align: center;">
 *     <div style="font-size: 32px; font-weight: bold;">92%</div>
 *     <div style="font-size: 14px;">Completion Rate</div>
 *   </div>
 * </mosaik-progress-ring>
 * ```
 *
 * @public
 */
export declare class ProgressRingElement extends ProgressRingElement_base implements IProgressRingElementProps {
    private readonly _inlineStyleController;
    private _isIndeterminate;
    private _thickness;
    private _radius;
    constructor();
    /**
     * Returns the `is` property.
     *
     * @public
     * @static
     * @readonly
    */
    static get is(): string;
    /**
     * Determines if `ProgressRing` shows actual values `false` or generic, continuous progress feedback `true`.
     *
     * @public
     * @attr
     */
    get isIndeterminate(): boolean;
    set isIndeterminate(value: boolean);
    /**
     * Gets or sets the `thickness` property, which defines the thickness of the progress ring.
     *
     * @remarks
     * The CSS variable `--progress-ring-thickness` is set directly from this value via an inline style
     * on the host element. All calculations regarding the thickness of the ring are handled on the CSS side
     * to ensure consistency and flexibility. When no attribute is set, the theme token value is used.
     *
     * @public
     * @attr
     */
    get thickness(): CssLength;
    set thickness(value: CssLength);
    /**
     * Gets or sets the `radius` property, which defines the radius of the progress ring.
     *
     * @remarks
     * The CSS variable `--progress-ring-radius` is set directly from this value via an inline style
     * on the host element. All calculations regarding the size and dimensions of the ring are handled
     * on the CSS side to ensure consistency and flexibility. When no attribute is set, the theme token value is used.
     *
     * @public
     * @attr
     */
    get radius(): CssLength;
    set radius(value: CssLength);
    /**
     * @inheritdoc
     */
    protected onRangeValueChanged(prev: number, next: number): void;
}
/**
* @public
*/
export declare namespace ProgressRingElement {
    type Props = IProgressRingElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-progress-ring': ProgressRingElement;
    }
}
export {};
//# sourceMappingURL=ProgressRingElement.d.ts.map