ember-bootstrap/declarations/components/bs-progress/bar.d.ts

Bootstrap components for Ember.js

import Component from '@glimmer/component';
export interface ProgressBarSignature {
    Args: {
        minValue?: number;
        maxValue?: number;
        value?: number;
        showLabel?: boolean;
        striped?: boolean;
        animate?: boolean;
        roundDigits?: number;
        type?: 'default' | 'success' | 'info' | 'warning' | 'danger';
    };
    Blocks: {
        default: [percentRounded: number];
    };
    Element: HTMLDivElement;
}
/**
 Component for a single progress bar, see [Components.Progress](Components.Progress.html) for more examples.

 @class ProgressBar
 @namespace Components
 @extends Ember.Component
 @public
 */
export default class ProgressBar extends Component<ProgressBarSignature> {
    /**
     * The lower limit of the value range
     *
     * @property minValue
     * @type number
     * @default 0
     * @public
     */
    get minValue(): number;
    /**
     * The upper limit of the value range
     *
     * @property maxValue
     * @type number
     * @default 100
     * @public
     */
    get maxValue(): number;
    /**
     * The value the progress bar should represent
     *
     * @property value
     * @type number
     * @default 0
     * @public
     */
    get value(): number;
    /**
     If true a label will be shown inside the progress bar.
  
     By default, it will be the percentage corresponding to the `value` property, rounded to `roundDigits` digits.
     You can customize it by using the component with a block template, which the component yields the percentage
     value to:
  
     ```hbs
     {{#bs-progress}}
     {{#bs-progress-bar value=progressValue as |percent|}}{{progressValue}} ({{percent}}%){{/bs-progress-bar}}
     {{/bs-progress}}
     ```
  
     @property showLabel
     @type boolean
     @default false
     @public
     */
    get showLabel(): boolean;
    /**
     * Create a striped effect, see http://getbootstrap.com/components/#progress-striped
     *
     * @property striped
     * @type boolean
     * @default false
     * @public
     */
    get striped(): boolean;
    /**
     * Animate the stripes, see http://getbootstrap.com/components/#progress-animated
     *
     * @property animate
     * @type boolean
     * @default false
     * @public
     */
    get animate(): boolean;
    /**
     * Specify to how many digits the progress bar label should be rounded.
     *
     * @property roundDigits
     * @type number
     * @default 0
     * @public
     */
    get roundDigits(): number;
    /**
     * Property for type styling
     *
     * For the available types see the [Bootstrap docs](https://getbootstrap.com/docs/4.3/components/progress/#backgrounds)
     *
     * @property type
     * @type String
     * @default 'default'
     * @public
     */
    get type(): "default" | "success" | "info" | "warning" | "danger";
    get typeClass(): string;
    /**
     * The percentage of `value`
     *
     * @property percent
     * @type number
     * @protected
     * @readonly
     */
    get percent(): number;
    /**
     * The percentage of `value`, rounded to `roundDigits` digits
     *
     * @property percentRounded
     * @type number
     * @protected
     * @readonly
     */
    get percentRounded(): number;
    get percentStyleValue(): string;
}