@brightspace-ui/core 3.24.0 → 3.24.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.
|
@@ -49,9 +49,6 @@ export const dropdownContentStyles = css`
|
|
|
49
49
|
bottom: calc(100% + var(--d2l-dropdown-verticaloffset, 16px));
|
|
50
50
|
top: auto;
|
|
51
51
|
}
|
|
52
|
-
:host([_fixed-positioning][opened-above]) {
|
|
53
|
-
bottom: 0;
|
|
54
|
-
}
|
|
55
52
|
|
|
56
53
|
:host([data-mobile][opened]:not([mobile-tray])) {
|
|
57
54
|
animation: var(--d2l-dropdown-animation-name) 300ms ease;
|
|
@@ -64,6 +61,11 @@ export const dropdownContentStyles = css`
|
|
|
64
61
|
top: auto;
|
|
65
62
|
}
|
|
66
63
|
|
|
64
|
+
:host([_fixed-positioning][opened-above]),
|
|
65
|
+
:host([_fixed-positioning][data-mobile][opened-above]:not([mobile-tray])) {
|
|
66
|
+
bottom: 0;
|
|
67
|
+
}
|
|
68
|
+
|
|
67
69
|
.d2l-dropdown-content-pointer {
|
|
68
70
|
clip: rect(-5px, 21px, 8px, -7px);
|
|
69
71
|
display: inline-block;
|
|
@@ -301,7 +301,7 @@ The `getUTCDateTimeRange(rangeType, diff)` helper function can be used to get th
|
|
|
301
301
|
|
|
302
302
|
This component is built to be used alongside the [d2l-filter-dimension-set](#d2l-filter-dimension-set) component. It will give you a selectable filter value which expands to allow the user to select a date range using either the `d2l-input-date-time-range` or `d2l-input-date-range` component (depending on the `type` of the component). Selection triggers the `d2l-filter-change` event, with `start-value` and `end-value` (in UTC) being included in the changes for the `selected` item.
|
|
303
303
|
|
|
304
|
-
<!-- docs: demo code properties name:d2l-filter-dimension-set-date-time-range-value align:start autoOpen:true autoSize:false size:
|
|
304
|
+
<!-- docs: demo code properties name:d2l-filter-dimension-set-date-time-range-value align:start autoOpen:true autoSize:false size:xlarge -->
|
|
305
305
|
```html
|
|
306
306
|
<script type="module">
|
|
307
307
|
import '@brightspace-ui/core/components/filter/filter.js';
|
|
@@ -311,9 +311,12 @@ This component is built to be used alongside the [d2l-filter-dimension-set](#d2l
|
|
|
311
311
|
</script>
|
|
312
312
|
<d2l-filter>
|
|
313
313
|
<d2l-filter-dimension-set key="dates" text="Dates">
|
|
314
|
-
<d2l-filter-dimension-set-
|
|
315
|
-
<d2l-filter-dimension-set-date-text-value key="
|
|
316
|
-
<d2l-filter-dimension-set-date-
|
|
314
|
+
<d2l-filter-dimension-set-value key="60days" text="Last 60 days"></d2l-filter-dimension-set-value>
|
|
315
|
+
<d2l-filter-dimension-set-date-text-value key="lastHour" range="lastHour"></d2l-filter-dimension-set-date-text-value>
|
|
316
|
+
<d2l-filter-dimension-set-date-text-value key="48hours" range="48hours" disabled></d2l-filter-dimension-set-date-text-value>
|
|
317
|
+
<d2l-filter-dimension-set-date-text-value key="today" range="today"></d2l-filter-dimension-set-date-text-value>
|
|
318
|
+
<d2l-filter-dimension-set-date-text-value key="6months" range="6months"></d2l-filter-dimension-set-date-text-value>
|
|
319
|
+
<d2l-filter-dimension-set-date-time-range-value key="custom" type="date"></d2l-filter-dimension-set-date-time-range-value>
|
|
317
320
|
</d2l-filter-dimension-set>
|
|
318
321
|
</d2l-filter>
|
|
319
322
|
```
|
|
@@ -30,6 +30,7 @@ export const PopoverMixin = superclass => class extends superclass {
|
|
|
30
30
|
static get styles() {
|
|
31
31
|
return css`
|
|
32
32
|
:host {
|
|
33
|
+
--d2l-popover-default-animation-name: d2l-popover-animation;
|
|
33
34
|
--d2l-popover-default-background-color: #ffffff;
|
|
34
35
|
--d2l-popover-default-border-color: var(--d2l-color-mica);
|
|
35
36
|
--d2l-popover-default-border-radius: 0.3rem;
|
|
@@ -65,6 +66,16 @@ export const PopoverMixin = superclass => class extends superclass {
|
|
|
65
66
|
box-shadow: var(--d2l-popover-shadow, var(--d2l-popover-default-shadow));
|
|
66
67
|
box-sizing: border-box;
|
|
67
68
|
}
|
|
69
|
+
|
|
70
|
+
@keyframes d2l-popover-animation {
|
|
71
|
+
0% { opacity: 0; transform: translate(0, -10px); }
|
|
72
|
+
100% { opacity: 1; transform: translate(0, 0); }
|
|
73
|
+
}
|
|
74
|
+
@media (prefers-reduced-motion: no-preference) {
|
|
75
|
+
:host([opened]) {
|
|
76
|
+
animation: var(--d2l-popover-animation-name, var(--d2l-popover-default-animation-name)) 6000ms ease;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
68
79
|
`;
|
|
69
80
|
}
|
|
70
81
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brightspace-ui/core",
|
|
3
|
-
"version": "3.24.
|
|
3
|
+
"version": "3.24.1",
|
|
4
4
|
"description": "A collection of accessible, free, open-source web components for building Brightspace applications",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": "https://github.com/BrightspaceUI/core.git",
|