@brightspace-ui/core 1.196.1 → 1.197.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.
Files changed (54) hide show
  1. package/components/backdrop/README.md +5 -6
  2. package/components/backdrop/backdrop.js +3 -0
  3. package/components/breadcrumbs/breadcrumbs.js +2 -1
  4. package/components/button/button-icon.js +1 -0
  5. package/components/button/button-mixin.js +2 -0
  6. package/components/button/button-subtle.js +1 -0
  7. package/components/button/button.js +1 -0
  8. package/components/button/floating-buttons.js +1 -0
  9. package/components/calendar/calendar.js +1 -1
  10. package/components/card/card-footer-link.js +12 -2
  11. package/components/card/card-loading-shimmer.js +1 -0
  12. package/components/card/card.js +9 -0
  13. package/components/dialog/dialog-confirm.js +1 -2
  14. package/components/dialog/dialog-fullscreen.js +4 -5
  15. package/components/dialog/dialog-mixin.js +2 -0
  16. package/components/dialog/dialog.js +0 -2
  17. package/components/dropdown/dropdown-button-subtle.js +3 -3
  18. package/components/dropdown/dropdown-button.js +2 -0
  19. package/components/dropdown/dropdown-content-mixin.js +19 -0
  20. package/components/dropdown/dropdown-content.js +0 -3
  21. package/components/dropdown/dropdown-context-menu.js +2 -0
  22. package/components/dropdown/dropdown-menu.js +0 -3
  23. package/components/dropdown/dropdown-more.js +2 -0
  24. package/components/dropdown/dropdown-opener-mixin.js +2 -0
  25. package/components/dropdown/dropdown-tabs.js +0 -3
  26. package/components/filter/filter-dimension-set-value.js +3 -0
  27. package/components/filter/filter-dimension-set.js +5 -1
  28. package/components/form/form-mixin.js +1 -0
  29. package/components/form/form-native.js +0 -1
  30. package/components/form/form.js +0 -1
  31. package/components/icons/images/tier3/rubric-graded.svg +2 -2
  32. package/components/inputs/input-date-range.js +9 -1
  33. package/components/inputs/input-date-time-range-to.js +3 -0
  34. package/components/inputs/input-date-time-range.js +10 -1
  35. package/components/inputs/input-date-time.js +7 -1
  36. package/components/inputs/input-date.js +7 -1
  37. package/components/inputs/input-fieldset.js +3 -0
  38. package/components/inputs/input-radio-styles.js +2 -1
  39. package/components/inputs/input-time-range.js +10 -1
  40. package/components/inputs/input-time.js +6 -1
  41. package/components/link/README.md +1 -1
  42. package/components/list/README.md +11 -10
  43. package/components/list/demo/list-item-custom.js +7 -3
  44. package/components/list/demo/list-nested.html +6 -62
  45. package/components/list/list-item-generic-layout.js +85 -14
  46. package/components/list/list.js +27 -2
  47. package/components/selection/selection-input.js +4 -2
  48. package/components/selection/selection-mixin.js +1 -0
  49. package/components/switch/switch-mixin.js +1 -0
  50. package/custom-elements.json +47 -90
  51. package/generated/icons/tier3/rubric-graded.js +3 -2
  52. package/helpers/focus.js +4 -2
  53. package/mixins/labelled-mixin.js +1 -0
  54. package/package.json +1 -1
@@ -327,7 +327,7 @@
327
327
  "slots": [
328
328
  {
329
329
  "name": "",
330
- "description": "breadcrumb items"
330
+ "description": "Breadcrumb items"
331
331
  }
332
332
  ]
333
333
  },
@@ -1486,13 +1486,13 @@
1486
1486
  }
1487
1487
  ],
1488
1488
  "events": [
1489
- {
1490
- "name": "d2l-dialog-open",
1491
- "description": "Dispatched when the dialog is opened"
1492
- },
1493
1489
  {
1494
1490
  "name": "d2l-dialog-close",
1495
1491
  "description": "Dispatched with the action value when the dialog is closed for any reason"
1492
+ },
1493
+ {
1494
+ "name": "d2l-dialog-open",
1495
+ "description": "Dispatched when the dialog is opened"
1496
1496
  }
1497
1497
  ],
1498
1498
  "slots": [
@@ -1557,13 +1557,13 @@
1557
1557
  }
1558
1558
  ],
1559
1559
  "events": [
1560
- {
1561
- "name": "d2l-dialog-open",
1562
- "description": "Dispatched when the dialog is opened"
1563
- },
1564
1560
  {
1565
1561
  "name": "d2l-dialog-close",
1566
1562
  "description": "Dispatched with the action value when the dialog is closed for any reason"
1563
+ },
1564
+ {
1565
+ "name": "d2l-dialog-open",
1566
+ "description": "Dispatched when the dialog is opened"
1567
1567
  }
1568
1568
  ],
1569
1569
  "slots": [
@@ -1645,13 +1645,13 @@
1645
1645
  }
1646
1646
  ],
1647
1647
  "events": [
1648
- {
1649
- "name": "d2l-dialog-open",
1650
- "description": "Dispatched when the dialog is opened"
1651
- },
1652
1648
  {
1653
1649
  "name": "d2l-dialog-close",
1654
1650
  "description": "Dispatched with the action value when the dialog is closed for any reason"
1651
+ },
1652
+ {
1653
+ "name": "d2l-dialog-open",
1654
+ "description": "Dispatched when the dialog is opened"
1655
1655
  }
1656
1656
  ],
1657
1657
  "slots": [
@@ -2041,13 +2041,13 @@
2041
2041
  "name": "d2l-dropdown-close",
2042
2042
  "description": "Dispatched when the dropdown is closed"
2043
2043
  },
2044
- {
2045
- "name": "d2l-dropdown-focus-enter",
2046
- "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2047
- },
2048
2044
  {
2049
2045
  "name": "d2l-dropdown-position",
2050
2046
  "description": "Dispatched when the dropdown position finishes adjusting"
2047
+ },
2048
+ {
2049
+ "name": "d2l-dropdown-focus-enter",
2050
+ "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2051
2051
  }
2052
2052
  ],
2053
2053
  "slots": [
@@ -2378,13 +2378,13 @@
2378
2378
  "name": "d2l-dropdown-close",
2379
2379
  "description": "Dispatched when the dropdown is closed"
2380
2380
  },
2381
- {
2382
- "name": "d2l-dropdown-focus-enter",
2383
- "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2384
- },
2385
2381
  {
2386
2382
  "name": "d2l-dropdown-position",
2387
2383
  "description": "Dispatched when the dropdown position finishes adjusting"
2384
+ },
2385
+ {
2386
+ "name": "d2l-dropdown-focus-enter",
2387
+ "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2388
2388
  }
2389
2389
  ],
2390
2390
  "slots": [
@@ -2715,13 +2715,13 @@
2715
2715
  "name": "d2l-dropdown-close",
2716
2716
  "description": "Dispatched when the dropdown is closed"
2717
2717
  },
2718
- {
2719
- "name": "d2l-dropdown-focus-enter",
2720
- "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2721
- },
2722
2718
  {
2723
2719
  "name": "d2l-dropdown-position",
2724
2720
  "description": "Dispatched when the dropdown position finishes adjusting"
2721
+ },
2722
+ {
2723
+ "name": "d2l-dropdown-focus-enter",
2724
+ "description": "Dispatched when user focus enters the dropdown content (trap-focus option only)"
2725
2725
  }
2726
2726
  ],
2727
2727
  "slots": [
@@ -2961,11 +2961,6 @@
2961
2961
  "default": "\"\""
2962
2962
  }
2963
2963
  ],
2964
- "events": [
2965
- {
2966
- "name": "d2l-filter-dimension-data-change"
2967
- }
2968
- ],
2969
2964
  "slots": [
2970
2965
  {
2971
2966
  "name": "",
@@ -3161,13 +3156,13 @@
3161
3156
  "name": "submit",
3162
3157
  "description": "Dispatched when the form is submitted. Cancelling this event will prevent form submission."
3163
3158
  },
3164
- {
3165
- "name": "d2l-form-dirty",
3166
- "description": "Dispatched whenever any form element fires an `input` or `change` event. Can be used to track whether the form is dirty or not."
3167
- },
3168
3159
  {
3169
3160
  "name": "formdata",
3170
3161
  "description": "Dispatched after the entry list representing the form's data is constructed. This happens when the form is submitted just prior to submission. The form data can be obtained from the `detail`'s `formData` property."
3162
+ },
3163
+ {
3164
+ "name": "d2l-form-dirty",
3165
+ "description": "Dispatched whenever any form element fires an `input` or `change` event. Can be used to track whether the form is dirty or not."
3171
3166
  }
3172
3167
  ],
3173
3168
  "slots": [
@@ -3210,10 +3205,6 @@
3210
3205
  }
3211
3206
  ],
3212
3207
  "events": [
3213
- {
3214
- "name": "d2l-form-dirty",
3215
- "description": "Dispatched whenever any form element fires an `input` or `change` event. Can be used to track whether the form is dirty or not."
3216
- },
3217
3208
  {
3218
3209
  "name": "d2l-form-invalid",
3219
3210
  "description": "Dispatched when the form fails validation. The error map can be obtained from the `detail`'s `errors` property."
@@ -3221,6 +3212,10 @@
3221
3212
  {
3222
3213
  "name": "d2l-form-submit",
3223
3214
  "description": "Dispatched when the form is submitted. The form data can be obtained from the `detail`'s `formData` property."
3215
+ },
3216
+ {
3217
+ "name": "d2l-form-dirty",
3218
+ "description": "Dispatched whenever any form element fires an `input` or `change` event. Can be used to track whether the form is dirty or not."
3224
3219
  }
3225
3220
  ],
3226
3221
  "slots": [
@@ -3816,7 +3811,7 @@
3816
3811
  "events": [
3817
3812
  {
3818
3813
  "name": "change",
3819
- "description": "Dispatched when there is a change to selected start date or selected end date. \"start-value\" and \"end-value\" correspond to the selected values and are formatted in ISO 8601 calendar date format (\"YYYY-MM-DD\")."
3814
+ "description": "Dispatched when there is a change to selected start date or selected end date. `start-value` and `end-value` correspond to the selected values and are formatted in ISO 8601 calendar date format (`YYYY-MM-DD`)."
3820
3815
  }
3821
3816
  ]
3822
3817
  },
@@ -4102,7 +4097,7 @@
4102
4097
  "events": [
4103
4098
  {
4104
4099
  "name": "change",
4105
- "description": "Dispatched when there is a change to selected start date-time or selected end date-time. \"start-value\" and \"end-value\" correspond to the selected values and are formatted in ISO 8601 combined date and time format (\"YYYY-MM-DDTHH:mm:ss.sssZ\")."
4100
+ "description": "Dispatched when there is a change to selected start date-time or selected end date-time. `start-value` and `end-value` correspond to the selected values and are formatted in ISO 8601 combined date and time format (`YYYY-MM-DDTHH:mm:ss.sssZ`)."
4106
4101
  }
4107
4102
  ],
4108
4103
  "slots": [
@@ -4278,10 +4273,7 @@
4278
4273
  "events": [
4279
4274
  {
4280
4275
  "name": "change",
4281
- "description": "Dispatched when there is a change to selected date or selected time. \"value\" corresponds to the selected value and is formatted in ISO 8601 combined date and time format (\"YYYY-MM-DDTHH:mm:ss.sssZ\")."
4282
- },
4283
- {
4284
- "name": "d2l-labelled-mixin-label-elem-change"
4276
+ "description": "Dispatched when there is a change to selected date or selected time. `value` corresponds to the selected value and is formatted in ISO 8601 combined date and time format (`YYYY-MM-DDTHH:mm:ss.sssZ`)."
4285
4277
  }
4286
4278
  ]
4287
4279
  },
@@ -4436,10 +4428,7 @@
4436
4428
  "events": [
4437
4429
  {
4438
4430
  "name": "change",
4439
- "description": "Dispatched when there is a change to selected date. \"value\" corresponds to the selected value and is formatted in ISO 8601 calendar date format (\"YYYY-MM-DD\")."
4440
- },
4441
- {
4442
- "name": "d2l-labelled-mixin-label-elem-change"
4431
+ "description": "Dispatched when there is a change to selected date. `value` corresponds to the selected value and is formatted in ISO 8601 calendar date format (`YYYY-MM-DD`)."
4443
4432
  }
4444
4433
  ]
4445
4434
  },
@@ -4768,9 +4757,6 @@
4768
4757
  {
4769
4758
  "name": "change",
4770
4759
  "description": "Dispatched when an alteration to the value is committed (typically after focus is lost) by the user. The `value` attribute reflects a JavaScript Number which is parsed from the formatted input value."
4771
- },
4772
- {
4773
- "name": "d2l-labelled-mixin-label-elem-change"
4774
4760
  }
4775
4761
  ],
4776
4762
  "slots": [
@@ -4958,9 +4944,6 @@
4958
4944
  {
4959
4945
  "name": "change",
4960
4946
  "description": "Dispatched when an alteration to the value is committed (typically after focus is lost) by the user. The `value` attribute reflects a JavaScript Number which is parsed from the formatted input value."
4961
- },
4962
- {
4963
- "name": "d2l-labelled-mixin-label-elem-change"
4964
4947
  }
4965
4948
  ],
4966
4949
  "slots": [
@@ -5430,9 +5413,6 @@
5430
5413
  {
5431
5414
  "name": "input",
5432
5415
  "description": "Dispatched immediately after changes by the user"
5433
- },
5434
- {
5435
- "name": "d2l-labelled-mixin-label-elem-change"
5436
5416
  }
5437
5417
  ],
5438
5418
  "slots": [
@@ -5661,9 +5641,6 @@
5661
5641
  {
5662
5642
  "name": "input",
5663
5643
  "description": "Dispatched immediately after changes by the user"
5664
- },
5665
- {
5666
- "name": "d2l-labelled-mixin-label-elem-change"
5667
5644
  }
5668
5645
  ]
5669
5646
  },
@@ -5880,7 +5857,7 @@
5880
5857
  "events": [
5881
5858
  {
5882
5859
  "name": "change",
5883
- "description": "Dispatched when there is a change to selected start time or selected end time. \"start-value\" and \"end-value\" correspond to the selected values and are formatted in ISO 8601 calendar time format (\"hh:mm:ss\")."
5860
+ "description": "Dispatched when there is a change to selected start time or selected end time. `start-value` and `end-value` correspond to the selected values and are formatted in ISO 8601 calendar time format (`hh:mm:ss`)."
5884
5861
  }
5885
5862
  ]
5886
5863
  },
@@ -6046,10 +6023,7 @@
6046
6023
  "events": [
6047
6024
  {
6048
6025
  "name": "change",
6049
- "description": "Dispatched when there is a change to selected time. \"value\" corresponds to the selected value and is formatted in ISO 8601 time format (\"hh:mm:ss\")."
6050
- },
6051
- {
6052
- "name": "d2l-labelled-mixin-label-elem-change"
6026
+ "description": "Dispatched when there is a change to selected time. `value` corresponds to the selected value and is formatted in ISO 8601 time format (`hh:mm:ss`)."
6053
6027
  }
6054
6028
  ]
6055
6029
  },
@@ -6349,9 +6323,6 @@
6349
6323
  },
6350
6324
  {
6351
6325
  "name": "d2l-list-item-selected"
6352
- },
6353
- {
6354
- "name": "d2l-labelled-mixin-label-elem-change"
6355
6326
  }
6356
6327
  ]
6357
6328
  },
@@ -6545,9 +6516,6 @@
6545
6516
  {
6546
6517
  "name": "d2l-list-item-selected",
6547
6518
  "description": "Dispatched when the component item is selected"
6548
- },
6549
- {
6550
- "name": "d2l-labelled-mixin-label-elem-change"
6551
6519
  }
6552
6520
  ],
6553
6521
  "slots": [
@@ -6877,9 +6845,6 @@
6877
6845
  {
6878
6846
  "name": "d2l-list-item-selected",
6879
6847
  "description": "Dispatched when the component item is selected"
6880
- },
6881
- {
6882
- "name": "d2l-labelled-mixin-label-elem-change"
6883
6848
  }
6884
6849
  ],
6885
6850
  "slots": [
@@ -6959,14 +6924,12 @@
6959
6924
  ],
6960
6925
  "events": [
6961
6926
  {
6962
- "name": "d2l-list-selection-change",
6963
- "description": "Dispatched when the selection state changes"
6927
+ "name": "d2l-list-selection-changes",
6928
+ "description": "Dispatched once for a set of selection state changes (ex. select-all); event detail includes an array of objects where each object contains the `key` and `selected` state for each changed item"
6964
6929
  },
6965
6930
  {
6966
- "name": "d2l-list-selection-changes"
6967
- },
6968
- {
6969
- "name": "d2l-selection-provider-connected"
6931
+ "name": "d2l-list-selection-change",
6932
+ "description": "Dispatched when the selection state changes"
6970
6933
  }
6971
6934
  ],
6972
6935
  "slots": [
@@ -8132,9 +8095,6 @@
8132
8095
  },
8133
8096
  {
8134
8097
  "name": "d2l-selection-input-subscribe"
8135
- },
8136
- {
8137
- "name": "d2l-labelled-mixin-label-elem-change"
8138
8098
  }
8139
8099
  ]
8140
8100
  },
@@ -8253,11 +8213,6 @@
8253
8213
  "type": "boolean",
8254
8214
  "default": "false"
8255
8215
  }
8256
- ],
8257
- "events": [
8258
- {
8259
- "name": "d2l-selection-provider-connected"
8260
- }
8261
8216
  ]
8262
8217
  },
8263
8218
  {
@@ -8594,7 +8549,8 @@
8594
8549
  ],
8595
8550
  "events": [
8596
8551
  {
8597
- "name": "change"
8552
+ "name": "change",
8553
+ "description": "Dispatched when the `on` property is updated"
8598
8554
  }
8599
8555
  ]
8600
8556
  },
@@ -8681,7 +8637,8 @@
8681
8637
  ],
8682
8638
  "events": [
8683
8639
  {
8684
- "name": "change"
8640
+ "name": "change",
8641
+ "description": "Dispatched when the `on` property is updated"
8685
8642
  }
8686
8643
  ]
8687
8644
  },
@@ -1,5 +1,6 @@
1
1
  // auto-generated
2
2
  export const val = `<svg height="30" width="30" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30">
3
3
  <path fill="#494c4e" d="M17.641,17.98l-9.89,11.5a1.488,1.488,0,0,1-1.13.52.277.277,0,0,1-.09-.01.22.22,0,0,1-.08.01,1.509,1.509,0,0,1-1.01-.39l-4.95-4.5a1.5,1.5,0,1,1,2.02-2.22l3.9,3.55,8.95-10.42a1.5,1.5,0,1,1,2.28,1.96Z"/>
4
- <path fill="#494c4e" d="M26,0H4A4.012,4.012,0,0,0,0,4V20.85a3.5,3.5,0,0,1,1.505-.35A3.492,3.492,0,0,1,2,20.545V16H7v5H3.3a3.439,3.439,0,0,1,.556.411L5.6,23H6.729L9,20.356V16h3.741l1.1-1.282A3.48,3.48,0,0,1,16,13.551V9h5v5H18.3a3.417,3.417,0,0,1,1.547,2H21v5H17.681L14,25.28V28H11.661l-1.72,2H26a4.012,4.012,0,0,0,4-4V4A4.012,4.012,0,0,0,26,0ZM7,14H2V9H7ZM7,7H2V4A2.006,2.006,0,0,1,4,2H7Zm7,7H9V9h5Zm0-7H9V2h5Zm7,21H16V23h5ZM21,7H16V2h5Zm7,19a2.006,2.006,0,0,1-2,2H23V23h5Zm0-5H23V16h5Zm0-7H23V9h5Zm0-7H23V2h3a2.006,2.006,0,0,1,2,2Z"/></svg>
5
- </svg>`;
4
+ <path fill="#494c4e" d="M26,0H4A4.012,4.012,0,0,0,0,4V20.85a3.5,3.5,0,0,1,1.505-.35A3.492,3.492,0,0,1,2,20.545V16H7v5H3.3a3.439,3.439,0,0,1,.556.411L5.6,23H6.729L9,20.356V16h3.741l1.1-1.282A3.48,3.48,0,0,1,16,13.551V9h5v5H18.3a3.417,3.417,0,0,1,1.547,2H21v5H17.681L14,25.28V28H11.661l-1.72,2H26a4.012,4.012,0,0,0,4-4V4A4.012,4.012,0,0,0,26,0ZM7,14H2V9H7ZM7,7H2V4A2.006,2.006,0,0,1,4,2H7Zm7,7H9V9h5Zm0-7H9V2h5Zm7,21H16V23h5ZM21,7H16V2h5Zm7,19a2.006,2.006,0,0,1-2,2H23V23h5Zm0-5H23V16h5Zm0-7H23V9h5Zm0-7H23V2h3a2.006,2.006,0,0,1,2,2Z"/>
5
+ </svg>
6
+ `;
package/helpers/focus.js CHANGED
@@ -98,11 +98,13 @@ export function getPreviousFocusable(node, includeHidden) {
98
98
  return focusable;
99
99
  }
100
100
 
101
- export function getNextFocusable(node, includeHidden) {
101
+ export function getNextFocusable(node, includeHidden, ignore, ignoreChildren) {
102
102
 
103
103
  if (!node) return null;
104
104
 
105
105
  if (includeHidden === undefined) includeHidden = false;
106
+ if (ignore === undefined) ignore = true;
107
+ if (ignoreChildren === undefined) ignoreChildren = false;
106
108
 
107
109
  const _getNextFocusable = (node, ignore, ignoreChildren) => {
108
110
  if (!ignore && isFocusable(node, includeHidden)) return node;
@@ -128,7 +130,7 @@ export function getNextFocusable(node, includeHidden) {
128
130
  return null;
129
131
  };
130
132
 
131
- const focusable = _getNextFocusable(node, true, false);
133
+ const focusable = _getNextFocusable(node, ignore, ignoreChildren);
132
134
  return focusable;
133
135
 
134
136
  }
@@ -180,6 +180,7 @@ export const LabelledMixin = superclass => class extends superclass {
180
180
  }
181
181
 
182
182
  this.label = getLabel(this._labelElem);
183
+ /** @ignore */
183
184
  this.dispatchEvent(new CustomEvent(
184
185
  'd2l-labelled-mixin-label-elem-change', {
185
186
  bubbles: false,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brightspace-ui/core",
3
- "version": "1.196.1",
3
+ "version": "1.197.1",
4
4
  "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
5
5
  "repository": "https://github.com/BrightspaceUI/core.git",
6
6
  "publishConfig": {