@brightspace-ui/core 3.143.0 → 3.144.0

package/custom-elements.json

@@ -14271,7 +14271,8 @@
         {
           "name": "offset",
           "description": "Adjust the size of the gap between the tooltip and its target (px)",
-          "type": "number"
+          "type": "number",
+          "default": "10"
         },
         {
           "name": "show-truncated-only",
@@ -14300,7 +14301,7 @@
           "type": "string"
         },
         {
-          "name": "position",
+          "name": "positionLocation",
           "attribute": "position",
           "description": "ADVANCED: Force the tooltip to open in a certain direction. If no position is provided, the tooltip will open in the first position that has enough space for it in the order: bottom, top, right, left.",
           "type": "'top'|'bottom'|'left'|'right'"
@@ -14354,7 +14355,8 @@
           "name": "offset",
           "attribute": "offset",
           "description": "Adjust the size of the gap between the tooltip and its target (px)",
-          "type": "number"
+          "type": "number",
+          "default": "10"
         },
         {
           "name": "showTruncatedOnly",

package/helpers/demo/prism.html

@@ -1860,16 +1860,19 @@ class Card extends FocusMixin(RtlMixin(LitElement)) {
 				position: relative;
 			}
 			.d2l-card-link-container {
-				border-radius: 6px;
 				flex-basis: auto;
 				flex-grow: 1;
 				flex-shrink: 1;
-				overflow: hidden;
 				width: 100%; /* required for Legacy-Edge and FF when align-items: flex-start is specified */
 			}
 			.d2l-card-link-text {
 				display: inline-block;
 			}
+			.d2l-card-header {
+				border-start-end-radius: 6px;
+				border-start-start-radius: 6px;
+				overflow: hidden;
+			}
 
 			a {
 				bottom: -1px;
@@ -1906,22 +1909,14 @@ class Card extends FocusMixin(RtlMixin(LitElement)) {
 				padding-bottom: 1.2rem;
 			}
 			.d2l-card-actions {
+				inset-inline-end: 0.6rem;
 				position: absolute;
-				right: 0.6rem;
 				top: 0.6rem;
 				/* this must be higher than footer z-index so dropdowns will be on top */
 				z-index: 3;
 			}
-			:host([dir="rtl"]) .d2l-card-actions {
-				left: 0.6rem;
-				right: auto;
-			}
 			.d2l-card-actions ::slotted(*) {
-				margin-left: 0.3rem;
-			}
-			:host([dir="rtl"]) .d2l-card-actions ::slotted(*) {
-				margin-left: 0;
-				margin-right: 0.3rem;
+				margin-inline-start: 0.3rem;
 			}
 			.d2l-card-badge {
 				line-height: 0;
@@ -1950,23 +1945,17 @@ class Card extends FocusMixin(RtlMixin(LitElement)) {
 
 			:host([subtle]) {
 				border: none;
+			}
+			:host([subtle][href]) {
 				box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.03);
 			}
-			:host(:hover) {
+			:host([href]:not([_active]):hover) {
 				box-shadow: 0 2px 14px 1px rgba(0, 0, 0, 0.06);
 			}
-			:host([subtle]:hover) {
+			:host([subtle][href]:not([_active]):hover) {
 				box-shadow: 0 4px 18px 2px rgba(0, 0, 0, 0.06);
 			}
-			:host([_active]) {
-				border-color: transparent;
-				box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px var(--d2l-color-celestine);
-			}
-			:host([_active]:hover),
-			:host([subtle][_active]:hover) {
-				border-color: transparent;
-				box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px var(--d2l-color-celestine);
-			}
+			${getFocusRingStyles(() => ':host([_active])', {'extraStyles': css`border-color: transparent;`})}
 			/* .d2l-card-link-container-hover is used to only color/underline when
 			hovering the anchor; these styles are not applied when hovering actions */
 			:host([href]) .d2l-card-link-container-hover,
@@ -1982,21 +1971,14 @@ class Card extends FocusMixin(RtlMixin(LitElement)) {
 			:host([_dropdown-action-open]) {
 				z-index: 2;
 			}
-			:host(:not([href])),
-			:host([subtle]:not([href])) {
-				box-shadow: none;
-				transform: none;
-			}
 			@media (prefers-reduced-motion: no-preference) {
 				:host {
-					transition: transform 300ms ease-out 50ms, box-shadow 0.2s;
+					transition: box-shadow 0.2s;
 				}
-
-				:host(:hover),
-				:host([subtle]:hover),
-				:host([_active]:hover),
-				:host([subtle][_active]:hover) {
-					transform: translateY(-4px);
+			}
+			@media (prefers-contrast: more) {
+				:host([subtle]) {
+					border: 1px solid var(--d2l-color-gypsum);;
 				}
 			}
 		`];

package/helpers/focus.js

@@ -73,7 +73,7 @@ export function getFocusRingStyles(selector, { applyOnHover = false, extraStyles
 	}
 	@media (prefers-contrast: more) {
 		${cssSelector} {
-			outline-color: var(--d2l-focus-ring-color, Highlight);
+			outline-color: Highlight;
 		}
 	}`;
 }

package/lang/ar.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "إغلاق التنبيه",
 	"components.breadcrumbs.breadcrumb": "شريط التنقل",
 	"components.button-add.addItem": "إضافة عنصر",

package/lang/cy.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Cau Hysbysiad",
 	"components.breadcrumbs.breadcrumb": "Briwsionyn Bara",
 	"components.button-add.addItem": "Ychwanegu Eitem",

package/lang/da.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Luk besked",
 	"components.breadcrumbs.breadcrumb": "Brødkrumme",
 	"components.button-add.addItem": "Tilføj element",

package/lang/de.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Benachrichtigung schließen",
 	"components.breadcrumbs.breadcrumb": "Brotkrümelnavigation",
 	"components.button-add.addItem": "Element hinzufügen",

package/lang/en-gb.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Close Alert",
 	"components.breadcrumbs.breadcrumb": "Breadcrumb",
 	"components.button-add.addItem": "Add Item",

package/lang/en.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Close Alert",
 	"components.breadcrumbs.breadcrumb": "Breadcrumb",
 	"components.button-add.addItem": "Add Item",

package/lang/es-es.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Cerrar alerta",
 	"components.breadcrumbs.breadcrumb": "Ruta de navegación",
 	"components.button-add.addItem": "Agregar elemento",

package/lang/es.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Cerrar alerta",
 	"components.breadcrumbs.breadcrumb": "Ruta de navegación",
 	"components.button-add.addItem": "Agregar elemento",

package/lang/fr-fr.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Fermer l’alerte",
 	"components.breadcrumbs.breadcrumb": "Chemin de navigation",
 	"components.button-add.addItem": "Ajouter un élément",

package/lang/fr.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Fermer l’alerte",
 	"components.breadcrumbs.breadcrumb": "Chemin de navigation",
 	"components.button-add.addItem": "Ajouter un élément",

package/lang/haw.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Pani i ka makaʻala",
 	"components.breadcrumbs.breadcrumb": "Palapalapala",
 	"components.button-add.addItem": "Pākuʻi Mea",

package/lang/hi.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "अलर्ट बंद करें",
 	"components.breadcrumbs.breadcrumb": "ब्रेडक्रंब",
 	"components.button-add.addItem": "आइटम जोड़ें",

package/lang/ja.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "アラートを閉じる",
 	"components.breadcrumbs.breadcrumb": "階層",
 	"components.button-add.addItem": "項目の追加",

package/lang/ko.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "경보 닫기",
 	"components.breadcrumbs.breadcrumb": "이동 경로",
 	"components.button-add.addItem": "항목 추가",

package/lang/mi.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Kati Matohi",
 	"components.breadcrumbs.breadcrumb": "Pānui",
 	"components.button-add.addItem": "Tāpiri Tūemi",

package/lang/nl.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Waarschuwing sluiten",
 	"components.breadcrumbs.breadcrumb": "Kruimelpad",
 	"components.button-add.addItem": "Item toevoegen",

package/lang/pt.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Fechar alerta",
 	"components.breadcrumbs.breadcrumb": "Auxiliar de navegação",
 	"components.button-add.addItem": "Adicionar item",

package/lang/sv.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Stängningsvarning",
 	"components.breadcrumbs.breadcrumb": "Sökväg",
 	"components.button-add.addItem": "Lägg till objekt",

package/lang/tr.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "Kapatma Uyarısı",
 	"components.breadcrumbs.breadcrumb": "İçerik Haritası",
 	"components.button-add.addItem": "Öğe Ekle",

package/lang/zh-cn.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "关闭提醒",
 	"components.breadcrumbs.breadcrumb": "痕迹导航",
 	"components.button-add.addItem": "添加项目",

package/lang/zh-tw.js

@@ -1,5 +1,4 @@
 export default {
-	"__test__": "This will be removed in a follow-up PR (before translation)",
 	"components.alert.close": "關閉警示",
 	"components.breadcrumbs.breadcrumb": "導覽路徑",
 	"components.button-add.addItem": "新增項目",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "3.143.0",
+  "version": "3.144.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",

package/templates/primary-secondary/primary-secondary.js

@@ -3,9 +3,9 @@ import '../../components/icons/icon-custom.js';
 import '../../components/icons/icon.js';
 import '../../components/offscreen/offscreen.js';
 import { css, html, LitElement, unsafeCSS } from 'lit';
+import { getFocusPseudoClass, getFocusRingStyles } from '../../helpers/focus.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { formatPercent } from '@brightspace-ui/intl';
-import { getFocusPseudoClass } from '../../helpers/focus.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { RtlMixin } from '../../mixins/rtl/rtl-mixin.js';
@@ -939,11 +939,7 @@ class TemplatePrimarySecondary extends RtlMixin(LocalizeCoreElement(LitElement))
 					color: white;
 					display: block;
 				}
-				.d2l-template-primary-secondary-divider:${unsafeCSS(getFocusPseudoClass())} .d2l-template-primary-secondary-divider-handle-mobile {
-					box-shadow: 0 0 0 0.1rem white, 0 0 0 0.2rem var(--d2l-color-celestine);
-					right: 0.2rem;
-				}
-
+				${getFocusRingStyles(pseudoClass => `.d2l-template-primary-secondary-divider:${pseudoClass} .d2l-template-primary-secondary-divider-handle-mobile`, { extraStyles: css`right: 0.2rem; box-shadow: 0 0 0 2px #ffffff;` })}
 				.d2l-template-primary-secondary-divider-shadow {
 					box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.25);
 					display: block;