constcreateProgressbar:WidgetFactory<ProgressbarWidget>
Create a Progressbar with given config props
an optional progressbar config
a ProgressbarWidget
constgetProgressbarDefaultConfig: () =>ProgressbarProps
Retrieve a shallow copy of the default Progressbar config
the default Progressbar config
Directive that provides a template reference for the progress bar context. This directive provides a template reference for the ProgressbarContext.
ProgressbarComponent is a UI component that extends the BaseWidgetDirective to create a customizable progress bar widget. It provides various inputs to configure the appearance and behavior of the progress bar.
readonlyanimated:InputSignalWithTransform<undefined|boolean,unknown>
If true, animates a striped progressbar.
Takes effect only for browsers supporting CSS3 animations, and if striped is true.
false
readonlyariaLabel:InputSignal<undefined|string>
The aria label.
'Progressbar'
readonlyariaValueTextFn:InputSignal<undefined| (value,minimum,maximum) =>undefined|string>
Return the value for the 'aria-valuetext' attribute.
current value
minimum value
maximum value
() => undefined
readonlychildren:InputSignal<SlotContent<ProgressbarContext>>
Label of the progress.
readonlyclassName:InputSignal<undefined|string>
CSS classes to be applied on the widget main container
''
readonlyheight:InputSignal<undefined|string>
Height of the progressbar, can be any valid css height value.
''
readonlymax:InputSignalWithTransform<undefined|number,unknown>
The maximum value.
100
readonlymin:InputSignalWithTransform<undefined|number,unknown>
The minimum value.
0
readonlystriped:InputSignalWithTransform<undefined|boolean,unknown>
If true, shows a striped progressbar.
false
readonlystructure:InputSignal<SlotContent<ProgressbarContext>>
Global template for the Progressbar.
readonlytype:InputSignal<undefined|BSContextualClass>
Type of the progressbar, following bootstrap types.
readonlyvalue:InputSignalWithTransform<undefined|number,unknown>
The current value.
0
get api():
W["api"]
Retrieves the widget api
W["api"]
the widget api
get directives():
W["directives"]
Retrieves the widget directives
W["directives"]
the widget directives
get state():
AngularState<W>
Retrieves the widget state. Each property of the state is exposed through an Angular Signal
AngularState<W>
the widget state
Represents the context for a Progressbar widget. This interface is used to define the context object that is passed to the Progressbar widget.
api:
object
all the api functions to interact with the widget
directives:
ProgressbarDirectives
directives to be used on html elements in the template of the widget or in the slots
state:
AngularState<W>
The state of the widget. Each property of the state is exposed through an Angular Signal
constprogressbarDefaultSlotStructure:SlotContent<ProgressbarContext>
Represents the default slot structure for the progress bar component.
Interface representing directives for a progress bar component.
ariaDirective:
Directive
A directive to be applied to the main container that handles aria attributes.
Interface representing the properties for the Progressbar component.
animated:
boolean
If true, animates a striped progressbar.
Takes effect only for browsers supporting CSS3 animations, and if striped is true.
false
ariaLabel:
string
The aria label.
'Progressbar'
ariaValueTextFn: (
value,minimum,maximum) =>undefined|string
Return the value for the 'aria-valuetext' attribute.
number
current value
number
minimum value
number
maximum value
undefined | string
() => undefinedchildren:
SlotContent<ProgressbarContext>
Label of the progress.
className:
string
CSS classes to be applied on the widget main container
''
height:
string
Height of the progressbar, can be any valid css height value.
''
max:
number
The maximum value.
100
min:
number
The minimum value.
0
striped:
boolean
If true, shows a striped progressbar.
false
structure:
SlotContent<ProgressbarContext>
Global template for the Progressbar.
type:
undefined|BSContextualClass
Type of the progressbar, following bootstrap types.
value:
number
The current value.
0
Represents the state of a Progressbar component.
animated:
boolean
If true, animates a striped progressbar.
Takes effect only for browsers supporting CSS3 animations, and if striped is true.
false
ariaLabel:
string
The aria label.
'Progressbar'
ariaValueText:
undefined|string
The aria value text.
children:
SlotContent<ProgressbarContext>
Label of the progress.
className:
string
CSS classes to be applied on the widget main container
''
finished:
boolean
true if the value has reached its maximum value.
height:
string
Height of the progressbar, can be any valid css height value.
''
max:
number
The maximum value.
100
min:
number
The minimum value.
0
percentage:
number
Percentage of completion.
started:
boolean
true if the value is above its minimum value.
striped:
boolean
If true, shows a striped progressbar.
false
structure:
SlotContent<ProgressbarContext>
Global template for the Progressbar.
type:
undefined|BSContextualClass
Type of the progressbar, following bootstrap types.
value:
number
The current value.
0
Directive to define the structure of a progress bar.
This directive provides a template reference for the ProgressbarContext.
ProgressbarWidget =
Widget<ProgressbarProps,ProgressbarState,object,ProgressbarDirectives>
Represents a Progressbar widget.
This type defines the structure of a Progressbar widget, including its properties, state, and directives.