@brightspace-ui/labs 2.51.0 → 2.52.0

package/package.json

@@ -31,10 +31,7 @@
     "./components/navigation/navigation-main-footer.js": "./src/components/navigation/navigation-main-footer.js",
     "./components/navigation/navigation-main-header.js": "./src/components/navigation/navigation-main-header.js",
     "./components/navigation/navigation-notification-icon.js": "./src/components/navigation/navigation-notification-icon.js",
-    "./components/navigation/navigation-separator.js": "./src/components/navigation/navigation-separator.js",
     "./components/navigation/navigation-shared-styles.js": "./src/components/navigation/navigation-shared-styles.js",
-    "./components/navigation/navigation-skip-main.js": "./src/components/navigation/navigation-skip-main.js",
-    "./components/navigation/navigation-skip.js": "./src/components/navigation/navigation-skip.js",
     "./components/navigation/navigation-styles.js": "./src/components/navigation/navigation-styles.js",
     "./components/navigation/navigation.js": "./src/components/navigation/navigation.js",
     "./components/opt-in-flyout.js": "./src/components/opt-in-flyout/opt-in-flyout.js",
@@ -113,5 +110,5 @@
     "parse-srt": "^1.0.0-alpha",
     "webvtt-parser": "^2"
   },
-  "version": "2.51.0"
+  "version": "2.52.0"
 }

package/src/components/navigation/navigation.js

@@ -1,5 +1,5 @@
+import '@brightspace-ui/core/components/skip-nav/skip-nav-main.js';
 import './navigation-band.js';
-import './navigation-skip-main.js';
 import { css, html, LitElement, nothing } from 'lit';
 import { getNextFocusable } from '@brightspace-ui/core/helpers/focus.js';
 
@@ -40,7 +40,7 @@ class Navigation extends LitElement {
 	}
 
 	render() {
-		const skipNav = this.hasSkipNav ? html`<d2l-labs-navigation-skip-main @d2l-labs-navigation-skip-fail="${this._handleSkipNavFail}"></d2l-labs-navigation-skip-main>` : nothing;
+		const skipNav = this.hasSkipNav ? html`<d2l-skip-nav-main @d2l-skip-nav-main-fail="${this._handleSkipNavFail}"></d2l-skip-nav-main>` : nothing;
 		return html`
 			${skipNav}<d2l-labs-navigation-band><slot name="navigation-band"></slot></d2l-labs-navigation-band>
 			<slot></slot>

package/src/lang/ar.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "العودة",
 	"components:navigation:next": "التالي",
 	"components:navigation:previous": "السابق",
-	"components:navigation:skipNav": "تجاوز إلى المحتوى الرئيسي",
 	"components:optInFlyout:cancel": "إلغاء",
 	"components:optInFlyout:close": "إغلاق مربع الحوار هذا",
 	"components:optInFlyout:done": "تم",

package/src/lang/cy.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Yn ôl",
 	"components:navigation:next": "Nesaf",
 	"components:navigation:previous": "Blaenorol",
-	"components:navigation:skipNav": "neidio i’r prif gynnwys",
 	"components:optInFlyout:cancel": "Canslo",
 	"components:optInFlyout:close": "Cau’r dialog hwn",
 	"components:optInFlyout:done": "Wedi Gorffen",

package/src/lang/da.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Tilbage",
 	"components:navigation:next": "Næste",
 	"components:navigation:previous": "Forrige",
-	"components:navigation:skipNav": "spring videre til hovedindhold",
 	"components:optInFlyout:cancel": "Annuller",
 	"components:optInFlyout:close": "Luk denne dialogboks",
 	"components:optInFlyout:done": "Udført",

package/src/lang/de.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Zurück",
 	"components:navigation:next": "Weiter",
 	"components:navigation:previous": "Zurück",
-	"components:navigation:skipNav": "zum Hauptinhalt springen",
 	"components:optInFlyout:cancel": "Abbrechen",
 	"components:optInFlyout:close": "Dieses Dialogfeld schließen",
 	"components:optInFlyout:done": "Fertig",

package/src/lang/en-gb.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Back",
 	"components:navigation:next": "Next",
 	"components:navigation:previous": "Previous",
-	"components:navigation:skipNav": "skip to main content",
 	"components:optInFlyout:cancel": "Cancel",
 	"components:optInFlyout:close": "Close this dialogue",
 	"components:optInFlyout:done": "Done",

package/src/lang/en.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Back",
 	"components:navigation:next": "Next",
 	"components:navigation:previous": "Previous",
-	"components:navigation:skipNav": "skip to main content",
 	"components:optInFlyout:cancel": "Cancel",
 	"components:optInFlyout:close": "Close this dialog",
 	"components:optInFlyout:done": "Done",

package/src/lang/es-es.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Volver",
 	"components:navigation:next": "Siguiente",
 	"components:navigation:previous": "Anterior",
-	"components:navigation:skipNav": "pasar al contenido principal",
 	"components:optInFlyout:cancel": "Cancelar",
 	"components:optInFlyout:close": "Cerrar este cuadro de diálogo",
 	"components:optInFlyout:done": "Hecho",

package/src/lang/es.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Volver",
 	"components:navigation:next": "Siguiente",
 	"components:navigation:previous": "Anterior",
-	"components:navigation:skipNav": "pasar al contenido principal",
 	"components:optInFlyout:cancel": "Cancelar",
 	"components:optInFlyout:close": "Cerrar este cuadro de diálogo",
 	"components:optInFlyout:done": "Listo",

package/src/lang/fr-fr.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Retour",
 	"components:navigation:next": "Suivant",
 	"components:navigation:previous": "Précédent",
-	"components:navigation:skipNav": "passer au contenu principal",
 	"components:optInFlyout:cancel": "Annuler",
 	"components:optInFlyout:close": "Fermer cette boîte de dialogue",
 	"components:optInFlyout:done": "Terminé",

package/src/lang/fr-on.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Retour",
 	"components:navigation:next": "Page suivante",
 	"components:navigation:previous": "Précédent",
-	"components:navigation:skipNav": "passer au contenu principal",
 	"components:optInFlyout:cancel": "Annuler",
 	"components:optInFlyout:close": "Fermer cette boîte de dialogue",
 	"components:optInFlyout:done": "Terminé",

package/src/lang/fr.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Retour",
 	"components:navigation:next": "Suivant",
 	"components:navigation:previous": "Précédent",
-	"components:navigation:skipNav": "passer au contenu principal",
 	"components:optInFlyout:cancel": "Annuler",
 	"components:optInFlyout:close": "Fermer cette boîte de dialogue",
 	"components:optInFlyout:done": "Terminé",

package/src/lang/haw.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Hoʻi",
 	"components:navigation:next": "Hiki mai",
 	"components:navigation:previous": "I mua",
-	"components:navigation:skipNav": "lele i ka mea nui o ka ʻike",
 	"components:optInFlyout:cancel": "Hoʻopau",
 	"components:optInFlyout:close": "Pani i kēia kamaʻilio",
 	"components:optInFlyout:done": "Pau",

package/src/lang/hi.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "वापस जाएँ",
 	"components:navigation:next": "अगला",
 	"components:navigation:previous": "पिछला",
-	"components:navigation:skipNav": "मुख्य सामग्री में जाएँ",
 	"components:optInFlyout:cancel": "कैंसल करें",
 	"components:optInFlyout:close": "यह संवाद बंद करें",
 	"components:optInFlyout:done": "पूरा हो गया",

package/src/lang/ja.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "戻る",
 	"components:navigation:next": "次へ",
 	"components:navigation:previous": "前へ",
-	"components:navigation:skipNav": "メインコンテンツへスキップ",
 	"components:optInFlyout:cancel": "キャンセル",
 	"components:optInFlyout:close": "このダイアログを閉じる",
 	"components:optInFlyout:done": "終了",

package/src/lang/ko.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "뒤로",
 	"components:navigation:next": "다음",
 	"components:navigation:previous": "이전",
-	"components:navigation:skipNav": "기본 콘텐츠로 건너뛰기",
 	"components:optInFlyout:cancel": "취소",
 	"components:optInFlyout:close": "이 대화 상자 닫기",
 	"components:optInFlyout:done": "완료",

package/src/lang/mi.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Hoki Whakamuri",
 	"components:navigation:next": "Whai Ake",
 	"components:navigation:previous": "Mua",
-	"components:navigation:skipNav": "whakarereke ki te ihirangi matua",
 	"components:optInFlyout:cancel": "Whakakore",
 	"components:optInFlyout:close": "Katia tēnei kōrero",
 	"components:optInFlyout:done": "Kua oti",

package/src/lang/nl.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Terug",
 	"components:navigation:next": "Volgende",
 	"components:navigation:previous": "Vorige",
-	"components:navigation:skipNav": "meteen naar hoofdinhoud gaan",
 	"components:optInFlyout:cancel": "Annuleren",
 	"components:optInFlyout:close": "Dit dialoogvenster sluiten",
 	"components:optInFlyout:done": "Gereed",

package/src/lang/pt.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Voltar",
 	"components:navigation:next": "Avançar",
 	"components:navigation:previous": "Anterior",
-	"components:navigation:skipNav": "passar para conteúdo principal",
 	"components:optInFlyout:cancel": "Cancelar",
 	"components:optInFlyout:close": "Fechar esta caixa de diálogo",
 	"components:optInFlyout:done": "Concluído",

package/src/lang/sv.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Tillbaka",
 	"components:navigation:next": "Nästa",
 	"components:navigation:previous": "Föregående",
-	"components:navigation:skipNav": "fortsätt till huvudinnehåll",
 	"components:optInFlyout:cancel": "Avbryt",
 	"components:optInFlyout:close": "Stäng dialogrutan",
 	"components:optInFlyout:done": "Klar",

package/src/lang/th.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "กลับ",
 	"components:navigation:next": "ถัดไป",
 	"components:navigation:previous": "ก่อนหน้า",
-	"components:navigation:skipNav": "ข้ามไปยังเนื้อหาหลัก",
 	"components:optInFlyout:cancel": "ยกเลิก",
 	"components:optInFlyout:close": "ปิดกล่องโต้ตอบนี้",
 	"components:optInFlyout:done": "เสร็จสิ้น",

package/src/lang/tr.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Geri",
 	"components:navigation:next": "İleri",
 	"components:navigation:previous": "Önceki",
-	"components:navigation:skipNav": "ana içeriğe atla",
 	"components:optInFlyout:cancel": "İptal et",
 	"components:optInFlyout:close": "Bu iletişim kutusunu kapat",
 	"components:optInFlyout:done": "Bitti",

package/src/lang/vi.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "Quay lại",
 	"components:navigation:next": "Tiếp theo",
 	"components:navigation:previous": "Trước",
-	"components:navigation:skipNav": "chuyển sang đến nội dung chính",
 	"components:optInFlyout:cancel": "Hủy",
 	"components:optInFlyout:close": "Đóng hộp thoại này",
 	"components:optInFlyout:done": "Hoàn tất",

package/src/lang/zh-cn.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "返回",
 	"components:navigation:next": "下一个",
 	"components:navigation:previous": "上一个",
-	"components:navigation:skipNav": "跳到主目录",
 	"components:optInFlyout:cancel": "取消",
 	"components:optInFlyout:close": "关闭此对话框",
 	"components:optInFlyout:done": "完成",

package/src/lang/zh-tw.js

@@ -61,7 +61,6 @@ export default {
 	"components:navigation:back": "返回",
 	"components:navigation:next": "下一個",
 	"components:navigation:previous": "上一個",
-	"components:navigation:skipNav": "跳至主要內容",
 	"components:optInFlyout:cancel": "取消",
 	"components:optInFlyout:close": "關閉此對話方塊",
 	"components:optInFlyout:done": "完成",

package/src/components/navigation/navigation-separator.js

@@ -1,30 +0,0 @@
-import '@brightspace-ui/core/components/colors/colors.js';
-import '@brightspace-ui/core/components/icons/icon.js';
-import { css, html, LitElement } from 'lit';
-
-/**
- * Separator component to be used between buttons in a navigational element.
- */
-class NavigationSeparator extends LitElement {
-
-	static get styles() {
-		return css`
-			:host {
-				display: inline-block;
-				margin: 0 9px;
-			}
-			d2l-icon {
-				color: var(--d2l-color-mica);
-			}
-		`;
-	}
-
-	render() {
-		return html`
-			<d2l-icon icon="tier2:divider-big"></d2l-icon>
-		`;
-	}
-
-}
-
-customElements.define('d2l-labs-navigation-separator', NavigationSeparator);

package/src/components/navigation/navigation-skip-main.js

@@ -1,31 +0,0 @@
-import './navigation-skip.js';
-import { html, LitElement } from 'lit';
-import { FocusMixin } from '@brightspace-ui/core/mixins/focus/focus-mixin.js';
-import { LocalizeLabsElement } from '../localize-labs-element.js';
-import { querySelectorComposed } from '@brightspace-ui/core/helpers/dom.js';
-
-class NavigationSkipMain extends FocusMixin(LocalizeLabsElement(LitElement)) {
-
-	static get focusElementSelector() {
-		return 'd2l-labs-navigation-skip';
-	}
-
-	render() {
-		return html`<d2l-labs-navigation-skip text="${this.localize('components:navigation:skipNav')}" @click="${this._handleSkipNav}" class="vdiff-target"></d2l-labs-navigation-skip>`;
-	}
-
-	_handleSkipNav() {
-		const elem = querySelectorComposed(document, 'main') ||
-			querySelectorComposed(document, '[role="main"]') ||
-			querySelectorComposed(document, 'h1');
-		if (elem) {
-			elem.tabIndex = -1;
-			elem.focus();
-		} else {
-			this.dispatchEvent(new CustomEvent('d2l-labs-navigation-skip-fail', { bubbles: false, composed: false }));
-		}
-	}
-
-}
-
-customElements.define('d2l-labs-navigation-skip-main', NavigationSkipMain);

package/src/components/navigation/navigation-skip.js

@@ -1,54 +0,0 @@
-import { css, html, LitElement } from 'lit';
-import { FocusMixin } from '@brightspace-ui/core/mixins/focus/focus-mixin.js';
-import { PropertyRequiredMixin } from '@brightspace-ui/core/mixins/property-required/property-required-mixin.js';
-
-class NavigationSkip extends FocusMixin(PropertyRequiredMixin(LitElement)) {
-
-	static get properties() {
-		return {
-			text: { required: true, type: String }
-		};
-	}
-
-	static get styles() {
-		return css`
-			a {
-				inset-inline-start: -10000px;
-				overflow: hidden;
-				position: absolute;
-				width: 1px;
-			}
-			a:active,
-			a:focus {
-				background-color: rgba(0, 0, 0, 0.7);
-				border: 1px solid rgba(0, 0, 0, 0.8);
-				color: #ffffff;
-				cursor: pointer;
-				display: block;
-				font-weight: bold;
-				inset-block-start: 0;
-				inset-inline-start: 25%;
-				margin: 0 auto;
-				outline: none;
-				padding: 0.3em;
-				text-align: center;
-				text-decoration: none;
-				width: 50%;
-				z-index: 10000;
-			}
-		`;
-	}
-
-	static get focusElementSelector() {
-		return 'a';
-	}
-
-	render() {
-		// Href attribute is needed for a11y tools to recognize anchor as a link
-		// and for click events to be dispatched using key presses
-		return html`<a href="javascript:void(0);" class="vdiff-target">${this.text}</a>`;
-	}
-
-}
-
-customElements.define('d2l-labs-navigation-skip', NavigationSkip);