@brightspace-ui/labs 2.1.0 → 2.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -13,7 +13,6 @@
|
|
|
13
13
|
"./components/opt-out-flyout.js": "./src/components/opt-in-flyout/opt-out-flyout.js",
|
|
14
14
|
"./components/opt-out-reason.js": "./src/components/opt-in-flyout/opt-out-reason.js",
|
|
15
15
|
"./components/pager-numeric.js": "./src/components/pagination/pager-numeric.js",
|
|
16
|
-
"./components/status-icon.js": "./src/components/status-icon/status-icon.js",
|
|
17
16
|
"./controllers/computed-value.js": "./src/controllers/computed-values/computed-value.js",
|
|
18
17
|
"./controllers/computed-values.js": "./src/controllers/computed-values/computed-values.js",
|
|
19
18
|
"./controllers/language-listener.js": "./src/controllers/language-listener/language-listener.js"
|
|
@@ -53,5 +52,5 @@
|
|
|
53
52
|
"@brightspace-ui/core": "^3",
|
|
54
53
|
"lit": "^3"
|
|
55
54
|
},
|
|
56
|
-
"version": "2.1.
|
|
55
|
+
"version": "2.1.1"
|
|
57
56
|
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
# d2l-labs-status-icon
|
|
2
|
-
|
|
3
|
-
Displays an icon as well as optional text to show the state/status of some feature or tool
|
|
4
|
-
|
|
5
|
-
## Usage
|
|
6
|
-
|
|
7
|
-
```html
|
|
8
|
-
<script type="module">
|
|
9
|
-
import '@brightspace-ui-labs/status-icon/status-icon.js';
|
|
10
|
-
</script>
|
|
11
|
-
<d2l-labs-status-icon state="failure" message="Failure"></d2l-labs-status-icon>
|
|
12
|
-
```
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
**Properties:**
|
|
17
|
-
|
|
18
|
-
| Property | Type | Description |
|
|
19
|
-
|--|--|--|
|
|
20
|
-
| `message` | String | Message to be displayed |
|
|
21
|
-
| `state` | String, default: `'failure'` | State of the status. Can be one of `failure`, `warning`, `success`. |
|
|
Binary file
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import '@brightspace-ui/core/components/colors/colors.js';
|
|
2
|
-
import '@brightspace-ui/core/components/icons/icon.js';
|
|
3
|
-
import { css, html, LitElement } from 'lit';
|
|
4
|
-
import { RtlMixin } from '@brightspace-ui/core/mixins/rtl-mixin.js';
|
|
5
|
-
|
|
6
|
-
function getIcon(state) {
|
|
7
|
-
switch (state) {
|
|
8
|
-
case 'success':
|
|
9
|
-
return 'tier1:check-circle';
|
|
10
|
-
case 'warning':
|
|
11
|
-
return 'tier1:alert';
|
|
12
|
-
default:
|
|
13
|
-
return 'tier1:close-circle';
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
class StatusIcon extends RtlMixin(LitElement) {
|
|
18
|
-
|
|
19
|
-
static get properties() {
|
|
20
|
-
return {
|
|
21
|
-
state: { type: String, reflect: true },
|
|
22
|
-
message: { type: String, reflect: true }
|
|
23
|
-
};
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
static get styles() {
|
|
27
|
-
return css`
|
|
28
|
-
:host {
|
|
29
|
-
align-items: center;
|
|
30
|
-
display: inline-flex;
|
|
31
|
-
}
|
|
32
|
-
:host([hidden]) {
|
|
33
|
-
display: none;
|
|
34
|
-
}
|
|
35
|
-
:host,
|
|
36
|
-
d2l-icon {
|
|
37
|
-
color: var(--d2l-color-cinnabar);
|
|
38
|
-
}
|
|
39
|
-
:host([state="warning"]),
|
|
40
|
-
:host([state="warning"]) d2l-icon {
|
|
41
|
-
color: var(--d2l-color-citrine);
|
|
42
|
-
}
|
|
43
|
-
:host([state="success"]),
|
|
44
|
-
:host([state="success"]) d2l-icon {
|
|
45
|
-
color: var(--d2l-color-olivine);
|
|
46
|
-
}
|
|
47
|
-
span {
|
|
48
|
-
margin-inline-start: 0.4em;
|
|
49
|
-
}
|
|
50
|
-
`;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
constructor() {
|
|
54
|
-
super();
|
|
55
|
-
this.state = 'failure';
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
render() {
|
|
59
|
-
const icon = getIcon(this.state);
|
|
60
|
-
return html`
|
|
61
|
-
<d2l-icon icon="${icon}"></d2l-icon>
|
|
62
|
-
<span>${this.message} </span>
|
|
63
|
-
`;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
}
|
|
67
|
-
customElements.define('d2l-labs-status-icon', StatusIcon);
|