@brightspace-ui/core 2.143.0 → 2.143.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.
@@ -72,6 +72,10 @@
72
72
  <d2l-demo-snippet>
73
73
  <template>
74
74
  <d2l-list extend-separators>
75
+ <d2l-list-controls slot="controls">
76
+ <d2l-selection-action icon="tier1:bookmark-hollow" text="Bookmark" requires-selection></d2l-selection-action>
77
+ <d2l-selection-action icon="tier1:gear" text="Settings"></d2l-selection-action>
78
+ </d2l-list-controls>
75
79
  <d2l-list-item key="L4-1" label="Label for L4-1" color="#ffba59" selectable>
76
80
  <d2l-list-item-content>
77
81
  <div>Ice Sheets (L4)</div>
@@ -264,34 +268,122 @@
264
268
  </template>
265
269
  </d2l-demo-snippet>
266
270
 
267
- <h2>Nested - Draggable and Expandable and Selectable</h2>
271
+
272
+ <h2>Nested - Extend Separators</h2>
268
273
 
269
274
  <d2l-demo-snippet code-view-hidden>
270
275
  <template>
271
- <d2l-list>
276
+ <d2l-list extend-separators>
277
+ <d2l-list-item key="L1-2" label="Label for L1-2">
278
+ <d2l-list-item-content>
279
+ <div>Biology (L1)</div>
280
+ </d2l-list-item-content>
281
+ </d2l-list-item>
282
+ <d2l-list-item key="L1-1" label="Label for L1-1" color="#00ff00ab">
283
+ <d2l-list-item-content>
284
+ <div>Earth Sciences (L1)</div>
285
+ <div slot="supporting-info">Earth science or geoscience includes all fields of natural science related to planet Earth. This is a branch of science dealing with the physical and chemical constitution of Earth and its atmosphere. Earth science can be considered to be a branch of planetary science, but with a much older history.</div>
286
+ </d2l-list-item-content>
287
+ <d2l-list slot="nested" grid separators="all" extend-separators>
288
+ <d2l-list-item key="L2-1" label="Label for L2-1" color="#ffba59" >
289
+ <d2l-list-item-content>
290
+ <div>Introductory Earth Sciences (L2)</div>
291
+ <div slot="supporting-info">This course explores the geological processes of the Earth's interior and surface. These include volcanism, earthquakes, mountain building, glaciation and weathering. Students will gain an appreciation of how these processes have controlled the evolution of our planet and the role of geology in meeting society's current and future demand for sustainable energy and mineral resources.</div>
292
+ </d2l-list-item-content>
293
+ </d2l-list-item>
294
+ </d2l-list>
295
+ <div slot="actions">
296
+ <d2l-button-icon text="My Button" icon="tier1:preview"></d2l-button-icon>
297
+ <d2l-dropdown-more text="Open!">
298
+ <d2l-dropdown-menu>
299
+ <d2l-menu label="Astronomy">
300
+ <d2l-menu-item text="Introduction"></d2l-menu-item>
301
+ <d2l-menu-item text="Searching for the Heavens "></d2l-menu-item>
302
+ </d2l-menu>
303
+ </d2l-dropdown-menu>
304
+ </d2l-dropdown-more>
305
+ </div>
306
+ </d2l-list-item>
307
+ </d2l-list>
308
+ </template>
309
+ </d2l-demo-snippet>
310
+
311
+ <h2>Nested - Extend Separators, Selectable</h2>
312
+
313
+ <d2l-demo-snippet code-view-hidden>
314
+ <template>
315
+ <d2l-list extend-separators>
272
316
  <d2l-list-controls slot="controls">
273
317
  <d2l-selection-action icon="tier1:bookmark-hollow" text="Bookmark" requires-selection></d2l-selection-action>
274
318
  <d2l-selection-action icon="tier1:gear" text="Settings"></d2l-selection-action>
275
319
  </d2l-list-controls>
276
- <d2l-list-item selectable key="L1-1" label="Label for L1-1" color="#ffba59" expandable expanded draggable>
320
+ <d2l-list-item selectable key="L1-2" label="Label for L1-2">
321
+ <d2l-list-item-content>
322
+ <div>Biology (L1)</div>
323
+ </d2l-list-item-content>
324
+ </d2l-list-item>
325
+ <d2l-list-item selectable key="L1-1" label="Label for L1-1" color="#00ff00ab">
277
326
  <d2l-list-item-content>
278
327
  <div>Earth Sciences (L1)</div>
279
328
  <div slot="supporting-info">Earth science or geoscience includes all fields of natural science related to planet Earth. This is a branch of science dealing with the physical and chemical constitution of Earth and its atmosphere. Earth science can be considered to be a branch of planetary science, but with a much older history.</div>
280
329
  </d2l-list-item-content>
281
- <d2l-list slot="nested" grid separators="all">
282
- <d2l-list-item selectable key="L2-1" label="Label for L2-1" color="#ffba59" expandable draggable>
330
+ <d2l-list slot="nested" grid separators="all" extend-separators>
331
+ <d2l-list-item selectable key="L2-1" label="Label for L2-1" color="#ffba59" >
332
+ <d2l-list-item-content>
333
+ <div>Introductory Earth Sciences (L2)</div>
334
+ <div slot="supporting-info">This course explores the geological processes of the Earth's interior and surface. These include volcanism, earthquakes, mountain building, glaciation and weathering. Students will gain an appreciation of how these processes have controlled the evolution of our planet and the role of geology in meeting society's current and future demand for sustainable energy and mineral resources.</div>
335
+ </d2l-list-item-content>
336
+ </d2l-list-item>
337
+ </d2l-list>
338
+ <div slot="actions">
339
+ <d2l-button-icon text="My Button" icon="tier1:preview"></d2l-button-icon>
340
+ <d2l-dropdown-more text="Open!">
341
+ <d2l-dropdown-menu>
342
+ <d2l-menu label="Astronomy">
343
+ <d2l-menu-item text="Introduction"></d2l-menu-item>
344
+ <d2l-menu-item text="Searching for the Heavens "></d2l-menu-item>
345
+ </d2l-menu>
346
+ </d2l-dropdown-menu>
347
+ </d2l-dropdown-more>
348
+ </div>
349
+ </d2l-list-item>
350
+ </d2l-list>
351
+ </template>
352
+ </d2l-demo-snippet>
353
+
354
+ <h2>Nested - Extend Separators, Expandable, Selectable</h2>
355
+
356
+ <d2l-demo-snippet code-view-hidden>
357
+ <template>
358
+ <d2l-list extend-separators>
359
+ <d2l-list-controls slot="controls">
360
+ <d2l-selection-action icon="tier1:bookmark-hollow" text="Bookmark" requires-selection></d2l-selection-action>
361
+ <d2l-selection-action icon="tier1:gear" text="Settings"></d2l-selection-action>
362
+ </d2l-list-controls>
363
+ <d2l-list-item selectable key="L1-1" label="Label for L1-1">
364
+ <d2l-list-item-content>
365
+ <div>Biology (L1)</div>
366
+ </d2l-list-item-content>
367
+ </d2l-list-item>
368
+ <d2l-list-item selectable key="L1-2" label="Label for L1-2" expandable expanded color="#00ff00ab">
369
+ <d2l-list-item-content>
370
+ <div>Earth Sciences (L1)</div>
371
+ <div slot="supporting-info">Earth science or geoscience includes all fields of natural science related to planet Earth. This is a branch of science dealing with the physical and chemical constitution of Earth and its atmosphere. Earth science can be considered to be a branch of planetary science, but with a much older history.</div>
372
+ </d2l-list-item-content>
373
+ <d2l-list slot="nested" grid separators="all" extend-separators>
374
+ <d2l-list-item selectable key="L2-1" label="Label for L2-1" color="#ffba59" expandable>
283
375
  <d2l-list-item-content>
284
376
  <div>Introductory Earth Sciences (L2)</div>
285
377
  <div slot="supporting-info">This course explores the geological processes of the Earth's interior and surface. These include volcanism, earthquakes, mountain building, glaciation and weathering. Students will gain an appreciation of how these processes have controlled the evolution of our planet and the role of geology in meeting society's current and future demand for sustainable energy and mineral resources.</div>
286
378
  </d2l-list-item-content>
287
379
  <d2l-list slot="nested" grid separators="all">
288
- <d2l-list-item selectable key="L3-1" label="Label for L3-1" color="#ffba59" expandable draggable>
380
+ <d2l-list-item selectable key="L3-1" label="Label for L3-1" color="#ffba59" expandable>
289
381
  <d2l-list-item-content>
290
382
  <div>Glaciation (L3)</div>
291
383
  <div slot="supporting-info">Supporting Info</div>
292
384
  </d2l-list-item-content>
293
- <d2l-list slot="nested" grid separators="all">
294
- <d2l-list-item selectable key="L4-1" label="Label for L4-1" color="#ffba59" draggable>
385
+ <d2l-list slot="nested" grid separators="all" extend-separators>
386
+ <d2l-list-item selectable key="L4-1" label="Label for L4-1" color="#ffba59">
295
387
  <d2l-list-item-content>
296
388
  <div>Ice Sheets (L4)</div>
297
389
  <div slot="supporting-info">Supporting Info</div>
@@ -320,9 +412,6 @@
320
412
  </d2l-dropdown-more>
321
413
  </div>
322
414
  </d2l-list-item>
323
- <d2l-list-item selectable key="L1-2" label="Label for L1-2">
324
- <div>Biology (L1)</div>
325
- </d2l-list-item>
326
415
  </d2l-list>
327
416
  </template>
328
417
  </d2l-demo-snippet>
@@ -30,6 +30,9 @@ export class ListControls extends SelectionControls {
30
30
  .d2l-list-controls-extend-separator {
31
31
  padding: 0 0.9rem;
32
32
  }
33
+ .d2l-list-controls-color.d2l-list-controls-extend-separator {
34
+ padding: 0 calc(0.9rem + 9px);
35
+ }
33
36
  `];
34
37
  }
35
38
 
@@ -167,8 +167,8 @@ export const ListItemMixin = superclass => class extends composeMixins(
167
167
  .d2l-list-item-content-extend-separators > [slot="control"] {
168
168
  width: 3rem;
169
169
  }
170
- .d2l-list-item-content-extend-separators > [slot="content"],
171
- :host([dir="rtl"]) .d2l-list-item-content-extend-separators > [slot="content"] {
170
+ :host(:not([_has-color-slot])) .d2l-list-item-content-extend-separators > [slot="content"],
171
+ :host(:not([_has-color-slot])[dir="rtl"]) .d2l-list-item-content-extend-separators > [slot="content"] {
172
172
  padding-left: 0.9rem;
173
173
  padding-right: 0.9rem;
174
174
  }
@@ -320,6 +320,11 @@ export const ListItemMixin = superclass => class extends composeMixins(
320
320
  margin: 0;
321
321
  }
322
322
 
323
+ :host([_has-color-slot]) .d2l-list-item-content-extend-separators [slot="outside-control-container"],
324
+ :host([dir="rtl"][_has-color-slot]) .d2l-list-item-content-extend-separators [slot="outside-control-container"] {
325
+ margin: 0 !important;
326
+ }
327
+
323
328
  :host(:not([draggable])[_has-color-slot]) [slot="outside-control-container"] {
324
329
  margin-left: -6px;
325
330
  }
@@ -396,6 +401,19 @@ export const ListItemMixin = superclass => class extends composeMixins(
396
401
  padding-left: 12px;
397
402
  padding-right: 0;
398
403
  }
404
+ :host(:not([_nested])) .d2l-list-item-content-extend-separators .d2l-list-item-color-outer {
405
+ padding-left: 3px;
406
+ }
407
+ :host(:not([_nested])[dir="rtl"]) .d2l-list-item-content-extend-separators .d2l-list-item-color-outer {
408
+ padding-left: 12px;
409
+ padding-right: 3px;
410
+ }
411
+ :host([selectable]:not([_render-expand-collapse-slot])) .d2l-list-item-content-extend-separators .d2l-list-item-color-outer {
412
+ padding-right: 0;
413
+ }
414
+ :host([selectable]:not([_render-expand-collapse-slot])[dir="rtl"]) .d2l-list-item-content-extend-separators .d2l-list-item-color-outer {
415
+ padding-left: 0;
416
+ }
399
417
  .d2l-list-item-color-outer + .d2l-list-expand-collapse {
400
418
  margin-left: -6px;
401
419
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brightspace-ui/core",
3
- "version": "2.143.0",
3
+ "version": "2.143.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",