@trimble-oss/moduswebcomponents/types/components/modus-wc-rating/modus-wc-rating.d.ts

Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust

import { EventEmitter } from '../../stencil-public-runtime';
import { ModusSize } from '../types';
export interface IRatingChange {
    newRating: number;
}
export type ModusWcRatingVariant = 'heart' | 'smiley' | 'star' | 'thumb';
/**
 * A rating component that allows users to choose a rating from predefined options
 */
export declare class ModusWcRating {
    private inheritedAttributes;
    private uniqueRatingGroupName;
    private readonly VARIANTS_WITHOUT_HALF_SUPPORT;
    /** Reference to the host element */
    el: HTMLElement;
    /** Whether to allow half-ratings. Only applies to star and heart variants. */
    allowHalf?: boolean;
    /** The number of rating items to display */
    count: number;
    /** Custom CSS class to apply */
    customClass?: string;
    /** Whether the rating component is disabled */
    disabled?: boolean;
    /** Function to provide aria-label text for a given rating-item index */
    getAriaLabelText?: (ratingValue: number) => string;
    /** The size of the rating component */
    size?: ModusSize;
    /** The variant of the rating scale */
    variant: ModusWcRatingVariant;
    /** The current value of the rating */
    value: number;
    /** Event emitted when the rating changes */
    ratingChange: EventEmitter<IRatingChange>;
    constructor();
    componentWillLoad(): void;
    private getClasses;
    /**
     * Gets the total number of rating items to render based on variant and settings
     */
    private getTotalRatingItems;
    private getValueForIndex;
    private handleChange;
    private supportsHalfRatings;
    private renderRatingItems;
    /**
     * Render the zero/reset option
     */
    private renderZeroOption;
    render(): any;
}