blob: 71978799fd5ebc46c605d0d771027d73696121e2 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
|
/**
* DO NOT EDIT
*
* This file was automatically generated by
* https://github.com/Polymer/gen-typescript-declarations
*
* To modify these typings, edit the source file(s):
* paper-progress.html
*/
/// <reference path="../polymer/types/polymer.d.ts" />
/// <reference path="../iron-flex-layout/iron-flex-layout.d.ts" />
/// <reference path="../iron-range-behavior/iron-range-behavior.d.ts" />
/// <reference path="../paper-styles/color.d.ts" />
/**
* Material design: [Progress & activity](https://www.google.com/design/spec/components/progress-activity.html)
*
* The progress bars are for situations where the percentage completed can be
* determined. They give users a quick sense of how much longer an operation
* will take.
*
* Example:
*
* <paper-progress value="10"></paper-progress>
*
* There is also a secondary progress which is useful for displaying intermediate
* progress, such as the buffer level during a streaming playback progress bar.
*
* Example:
*
* <paper-progress value="10" secondary-progress="30"></paper-progress>
*
* ### Styling progress bar:
*
* To change the active progress bar color:
*
* paper-progress {
* --paper-progress-active-color: #e91e63;
* }
*
* To change the secondary progress bar color:
*
* paper-progress {
* --paper-progress-secondary-color: #f8bbd0;
* }
*
* To change the progress bar background color:
*
* paper-progress {
* --paper-progress-container-color: #64ffda;
* }
*
* Add the class `transiting` to a paper-progress to animate the progress bar when
* the value changed. You can also customize the transition:
*
* paper-progress {
* --paper-progress-transition-duration: 0.08s;
* --paper-progress-transition-timing-function: ease;
* --paper-progress-transition-delay: 0s;
* }
*
* To change the duration of the indeterminate cycle:
*
* paper-progress {
* --paper-progress-indeterminate-cycle-duration: 2s;
* }
*
* The following mixins are available for styling:
*
* Custom property | Description | Default
* -------------------------------------------------|---------------------------------------------|--------------
* `--paper-progress-container` | Mixin applied to container | `{}`
* `--paper-progress-transition-duration` | Duration of the transition | `0.08s`
* `--paper-progress-transition-timing-function` | The timing function for the transition | `ease`
* `--paper-progress-transition-delay` | delay for the transition | `0s`
* `--paper-progress-container-color` | Color of the container | `--google-grey-300`
* `--paper-progress-active-color` | The color of the active bar | `--google-green-500`
* `--paper-progress-secondary-color` | The color of the secondary bar | `--google-green-100`
* `--paper-progress-disabled-active-color` | The color of the active bar if disabled | `--google-grey-500`
* `--paper-progress-disabled-secondary-color` | The color of the secondary bar if disabled | `--google-grey-300`
* `--paper-progress-height` | The height of the progress bar | `4px`
* `--paper-progress-indeterminate-cycle-duration` | Duration of an indeterminate cycle | `2s`
*/
interface PaperProgressElement extends Polymer.Element, Polymer.IronRangeBehavior {
/**
* The number that represents the current secondary progress.
*/
secondaryProgress: number|null|undefined;
/**
* The secondary ratio
*/
readonly secondaryRatio: number|null|undefined;
/**
* Use an indeterminate progress indicator.
*/
indeterminate: boolean|null|undefined;
/**
* True if the progress is disabled.
*/
disabled: boolean|null|undefined;
hostAttributes: object|null;
_toggleIndeterminate(indeterminate: any): void;
_transformProgress(progress: any, ratio: any): void;
_mainRatioChanged(ratio: any): void;
_progressChanged(secondaryProgress: any, value: any, min: any, max: any, indeterminate: any): void;
_disabledChanged(disabled: any): void;
_hideSecondaryProgress(secondaryRatio: any): any;
}
interface HTMLElementTagNameMap {
"paper-progress": PaperProgressElement;
}
|
