-
Notifications
You must be signed in to change notification settings - Fork 253
/
BusyIndicator.js
116 lines (99 loc) · 2.79 KB
/
BusyIndicator.js
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
import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
import { fetchI18nBundle, getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
import BusyIndicatorSize from "./types/BusyIndicatorSize.js";
// Template
import BusyIndicatorTemplate from "./generated/templates/BusyIndicatorTemplate.lit.js";
import { BUSY_INDICATOR_TITLE } from "./generated/i18n/i18n-defaults.js";
// Styles
import busyIndicatorCss from "./generated/themes/BusyIndicator.css.js";
/**
* @public
*/
const metadata = {
tag: "ui5-busyindicator",
slots: /** @lends sap.ui.webcomponents.main.BusyIndicator.prototype */ {
/**
* Determines the content over which the <code>ui5-busyindicator</code> will appear.
*
* @type {Node[]}
* @slot
* @public
*/
"default": {
type: Node,
},
},
properties: /** @lends sap.ui.webcomponents.main.BusyIndicator.prototype */ {
/**
* Defines the size of the <code>ui5-busyindicator</code>.
* <br><br>
* <b>Note:</b> Available options are "Small", "Medium" and "Large"
*
* @type {BusyIndicatorSize}
* @defaultvalue "Large"
* @public
*/
size: { type: BusyIndicatorSize, defaultValue: BusyIndicatorSize.Large },
/**
* Defines if the busy indicator is visible on the screen. By default it is not.
*
* @type {boolean}
* @defaultvalue false
* @public
*/
active: { type: Boolean },
},
};
/**
* @class
*
* <h3 class="comment-api-title">Overview</h3>
*
* The <code>ui5-busyindicator</code> signals that some operation is going on and that the
* user must wait. It does not block the current UI screen so other operations could be
* triggered in parallel.
*
* <h3>Usage</h3>
* For the <code>ui5-busyindicator</code> you can define the size of the indicator as well
* as whether it is shown or hidden. In order to hide it, use the html attribute <code>hidden</code> or <code>display: none;</code>
*
* <h3>ES6 Module Import</h3>
*
* <code>import "@ui5/webcomponents/dist/BusyIndicator";</code>
*
* @constructor
* @author SAP SE
* @alias sap.ui.webcomponents.main.BusyIndicator
* @extends UI5Element
* @tagname ui5-busyindicator
* @public
* @since 0.12.0
*/
class BusyIndicator extends UI5Element {
constructor() {
super();
this.i18nBundle = getI18nBundle("@ui5/webcomponents");
}
static get metadata() {
return metadata;
}
static get styles() {
return busyIndicatorCss;
}
static get render() {
return litRender;
}
static get template() {
return BusyIndicatorTemplate;
}
static async define(...params) {
await fetchI18nBundle("@ui5/webcomponents");
super.define(...params);
}
get ariaTitle() {
return this.i18nBundle.getText(BUSY_INDICATOR_TITLE);
}
}
BusyIndicator.define();
export default BusyIndicator;