@brightspace-ui/core 3.316.0 → 3.317.1

package/custom-elements.json

@@ -16765,80 +16765,6 @@
       "name": "d2l-tabs-array",
       "path": "./components/tabs/demo/tabs-array.js"
     },
-    {
-      "name": "d2l-tab-internal",
-      "path": "./components/tabs/tab-internal.js",
-      "attributes": [
-        {
-          "name": "controls-panel",
-          "type": "string"
-        },
-        {
-          "name": "text",
-          "type": "string"
-        },
-        {
-          "name": "aria-selected",
-          "type": "string",
-          "default": "\"false\""
-        },
-        {
-          "name": "role",
-          "type": "string",
-          "default": "\"tab\""
-        },
-        {
-          "name": "skeleton",
-          "description": "Render the component as a [skeleton loader](https://github.com/BrightspaceUI/core/tree/main/components/skeleton).",
-          "type": "boolean"
-        }
-      ],
-      "properties": [
-        {
-          "name": "controlsPanel",
-          "attribute": "controls-panel",
-          "type": "string"
-        },
-        {
-          "name": "text",
-          "attribute": "text",
-          "type": "string"
-        },
-        {
-          "name": "styles",
-          "type": "array",
-          "default": "[\"styles\",null]"
-        },
-        {
-          "name": "ariaSelected",
-          "attribute": "aria-selected",
-          "type": "string",
-          "default": "\"false\""
-        },
-        {
-          "name": "role",
-          "attribute": "role",
-          "type": "string",
-          "default": "\"tab\""
-        },
-        {
-          "name": "tabIndex",
-          "type": "number",
-          "default": "-1"
-        },
-        {
-          "name": "skeleton",
-          "attribute": "skeleton",
-          "description": "Render the component as a [skeleton loader](https://github.com/BrightspaceUI/core/tree/main/components/skeleton).",
-          "type": "boolean"
-        }
-      ],
-      "events": [
-        {
-          "name": "d2l-tab-selected"
-        }
-      ]
-    },
     {
       "name": "d2l-tab-panel",
       "path": "./components/tabs/tab-panel.js",
@@ -16849,16 +16775,6 @@
           "description": "REQUIRED: Id of the tab that labels this panel",
           "type": "string"
         },
-        {
-          "name": "selected",
-          "description": "DEPRECATED: Use to select the tab. Do NOT set if using the d2l-tab/d2l-tab-panel implementation.\nRemove with GAUD-8299-core-tabs-use-new-structure flag clean up.",
-          "type": "boolean"
-        },
-        {
-          "name": "text",
-          "description": "DEPRECATED: The text used for the tab, as well as labelling the panel. Required if not using d2l-tab/d2l-tab-panel implementation.\nRemove with GAUD-8299-core-tabs-use-new-structure flag clean up.",
-          "type": "string"
-        },
         {
           "name": "no-padding",
           "description": "Opt out of default padding/whitespace around the panel",
@@ -16873,21 +16789,9 @@
           "description": "REQUIRED: Id of the tab that labels this panel",
           "type": "string"
         },
-        {
-          "name": "selected",
-          "attribute": "selected",
-          "description": "DEPRECATED: Use to select the tab. Do NOT set if using the d2l-tab/d2l-tab-panel implementation.\nRemove with GAUD-8299-core-tabs-use-new-structure flag clean up.",
-          "type": "boolean"
-        },
-        {
-          "name": "text",
-          "attribute": "text",
-          "description": "DEPRECATED: The text used for the tab, as well as labelling the panel. Required if not using d2l-tab/d2l-tab-panel implementation.\nRemove with GAUD-8299-core-tabs-use-new-structure flag clean up.",
-          "type": "string"
-        },
         {
           "name": "styles",
-          "default": "\"css`\\n\\t\\t:host {\\n\\t\\t\\tbox-sizing: border-box;\\n\\t\\t\\tdisplay: none;\\n\\t\\t\\tmargin: 1.2rem 0 0 0;\\n\\t\\t}\\n\\t\\t:host([no-padding]) {\\n\\t\\t\\tmargin: 0;\\n\\t\\t}\\n\\t\\t/* clean up with GAUD-8299-core-tabs-use-new-structure flag clean up */\\n\\t\\t:host([selected]) {\\n\\t\\t\\tdisplay: block;\\n\\t\\t}\\n\\t\\t:host([_selected]) {\\n\\t\\t\\tdisplay: block;\\n\\t\\t}\\n\\t`\""
+          "default": "\"css`\\n\\t\\t:host {\\n\\t\\t\\tbox-sizing: border-box;\\n\\t\\t\\tdisplay: none;\\n\\t\\t\\tmargin: 1.2rem 0 0 0;\\n\\t\\t}\\n\\t\\t:host([no-padding]) {\\n\\t\\t\\tmargin: 0;\\n\\t\\t}\\n\\t\\t:host([_selected]) {\\n\\t\\t\\tdisplay: block;\\n\\t\\t}\\n\\t`\""
         },
         {
           "name": "noPadding",
@@ -16897,16 +16801,6 @@
           "default": "false"
         }
       ],
-      "events": [
-        {
-          "name": "d2l-tab-panel-selected",
-          "description": "DEPRECATED: Dispatched when a tab is selected"
-        },
-        {
-          "name": "d2l-tab-panel-text-changed",
-          "description": "DEPRECATED: Dispatched when the text attribute is changed"
-        }
-      ],
       "slots": [
         {
           "name": "",
@@ -17060,10 +16954,6 @@
         }
       ],
       "slots": [
-        {
-          "name": "",
-          "description": "DEPRECATED: Contains the tab panels (e.g., \"d2l-tab-panel\" components)"
-        },
         {
           "name": "ext",
           "description": "Additional content (e.g., a button) positioned at right"

package/package.json

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

package/components/tabs/tab-internal.js

@@ -1,144 +0,0 @@
-import '../colors/colors.js';
-import { css, html, LitElement } from 'lit';
-import { classMap } from 'lit/directives/class-map.js';
-import { getFocusRingStyles } from '../../helpers/focus.js';
-import { overflowEllipsisDeclarations } from '../../helpers/overflow.js';
-import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
-
-const keyCodes = {
-	ENTER: 13,
-	SPACE: 32
-};
-
-// remove file with GAUD-8299-core-tabs-use-new-structure flag clean up
-class Tab extends SkeletonMixin(LitElement) {
-
-	static properties = {
-		ariaSelected: { type: String, reflect: true, attribute: 'aria-selected' },
-		controlsPanel: { type: String, reflect: true, attribute: 'controls-panel' },
-		// eslint-disable-next-line lit/no-native-attributes
-		role: { type: String, reflect: true },
-		text: { type: String }
-	};
-
-	static styles = [super.styles, css`
-		:host {
-			box-sizing: border-box;
-			display: inline-block;
-			max-width: 200px;
-			outline: none;
-			position: relative;
-			vertical-align: middle;
-		}
-		.d2l-tab-text {
-			--d2l-focus-ring-offset: 0;
-			margin: 0.5rem;
-			padding: 0.1rem;
-			${overflowEllipsisDeclarations}
-		}
-		:host([skeleton]) .d2l-tab-text.d2l-skeletize::before {
-			bottom: 0.15rem;
-			top: 0.15rem;
-		}
-		:host(:first-child) .d2l-tab-text {
-			margin-inline-start: 0;
-		}
-		.d2l-tab-selected-indicator {
-			border-top: 4px solid var(--d2l-theme-brand-color-primary-default);
-			border-top-left-radius: 4px;
-			border-top-right-radius: 4px;
-			bottom: 0;
-			display: none;
-			margin: 1px 0.6rem 0 0.6rem;
-			position: absolute;
-			-webkit-transition: box-shadow 0.2s;
-			transition: box-shadow 0.2s;
-			width: calc(100% - 1.2rem);
-		}
-		:host([skeleton]) .d2l-tab-selected-indicator {
-			position: absolute; /* make sure skeleton styles do not override this */
-		}
-		.d2l-tab-text-skeletize-override {
-			min-width: 50px;
-		}
-		:host(:first-child) .d2l-tab-selected-indicator {
-			margin-inline-start: 0;
-			width: calc(100% - 0.6rem);
-		}
-		${getFocusRingStyles(pseudoClass => `:host(:${pseudoClass}) > .d2l-tab-text`, { extraStyles: css`border-radius: 0.3rem; color: var(--d2l-theme-text-color-interactive-default);` })}
-		:host([aria-selected="true"]:focus) {
-			text-decoration: none;
-		}
-		:host(:hover) {
-			color: var(--d2l-theme-text-color-interactive-default);
-			cursor: pointer;
-		}
-		:host([aria-selected="true"]:hover) {
-			color: inherit;
-			cursor: default;
-		}
-		:host([aria-selected="true"]) .d2l-tab-selected-indicator {
-			display: block;
-		}
-
-		@media (prefers-reduced-motion: reduce) {
-			.d2l-tab-selected-indicator {
-				-webkit-transition: none;
-				transition: none;
-			}
-		}
-	`];
-
-	constructor() {
-		super();
-		this.ariaSelected = 'false';
-		this.role = 'tab';
-		this.tabIndex = -1;
-	}
-
-	firstUpdated(changedProperties) {
-		super.firstUpdated(changedProperties);
-		this.addEventListener('click', () => {
-			this.ariaSelected = 'true';
-		});
-		this.addEventListener('keydown', (e) => {
-			if (e.keyCode !== keyCodes.SPACE) return;
-			e.stopPropagation();
-			e.preventDefault();
-		});
-		this.addEventListener('keyup', (e) => {
-			if (e.keyCode !== keyCodes.ENTER && e.keyCode !== keyCodes.SPACE) return;
-			this.ariaSelected = 'true';
-		});
-	}
-
-	render() {
-		const overrideSkeletonText = this.skeleton && (!this.text || this.text.length === 0);
-		const textClasses = {
-			'd2l-tab-text': true,
-			'd2l-skeletize': true,
-			'd2l-tab-text-skeletize-override': overrideSkeletonText
-		};
-
-		return html`
-			<div class="${classMap(textClasses)}">${overrideSkeletonText ? html`&nbsp;` : this.text}</div>
-			<div class="d2l-tab-selected-indicator d2l-skeletize-container"></div>
-		`;
-	}
-
-	update(changedProperties) {
-		super.update(changedProperties);
-		changedProperties.forEach((oldVal, prop) => {
-			if (prop === 'ariaSelected' && this.ariaSelected === 'true') {
-				this.dispatchEvent(new CustomEvent(
-					'd2l-tab-selected', { bubbles: true, composed: true }
-				));
-			} else if (prop === 'text') {
-				this.title = this.text;
-			}
-		});
-	}
-
-}
-
-customElements.define('d2l-tab-internal', Tab);