@brightspace-ui/core 3.319.0 → 3.320.0

package/components/empty-state/empty-state-action-link.js

@@ -1,13 +1,14 @@
 import { html, LitElement, nothing } from 'lit';
 import { bodyCompactStyles } from '../typography/styles.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
+import { LinkMixin } from '../link/link-mixin.js';
 import { linkStyles } from '../link/link.js';
 import { PropertyRequiredMixin } from '../../mixins/property-required/property-required-mixin.js';
 
 /**
  * `d2l-empty-state-action-link` is an empty state action component that can be placed inside of the default slot of `empty-state-simple` or `empty-state-illustrated` to add a link action to the component.
  */
-class EmptyStateActionLink extends FocusMixin(PropertyRequiredMixin(LitElement)) {
+class EmptyStateActionLink extends LinkMixin(FocusMixin(PropertyRequiredMixin(LitElement))) {
 
 	static properties = {
 		/**
@@ -22,19 +23,17 @@ class EmptyStateActionLink extends FocusMixin(PropertyRequiredMixin(LitElement))
 		href: { type: String, required: true },
 	};
 
-	static styles = [bodyCompactStyles, linkStyles];
+	static styles = [super.styles, bodyCompactStyles, linkStyles];
 
 	static get focusElementSelector() {
 		return '.d2l-link';
 	}
 
 	render() {
-		const actionLink = this.text && this.href
-			? html`
-				<a class="d2l-body-compact d2l-link" href=${this.href}>${this.text}</a>`
-			: nothing;
-
-		return html`${actionLink}`;
+		if (!this.text || !this.href) return nothing;
+		const linkClasses = { 'd2l-body-compact': true, 'd2l-link': true };
+		const inner = html`${this.text}${this._renderNewWindowIcon()}`;
+		return this._render(inner, { linkClasses });
 	}
 
 }

package/components/inputs/input-radio-styles.js

@@ -47,7 +47,7 @@ function _getRadioStyleSelectors(inputSelectors) {
  * A private helper method that should not be used by general consumers
  */
 export function _generateRadioStyles(selector, containerSelector) {
-	if (!_isValidCssSelector(selector) || (containerSelector && !_isValidCssSelector(containerSelector))) return '';
+	if (!_isValidCssSelector(selector) || (containerSelector && !_isValidCssSelector(containerSelector))) return;
 	const inputSelectors = [selector];
 	if (containerSelector) {
 		inputSelectors.push(`${containerSelector} > input[type="radio"]`);

package/components/inputs/input-select-styles.js

@@ -38,7 +38,7 @@ function _getSelectFocusStyles(selector) {
  * A private helper method that should not be used by general consumers
  */
 export function _generateSelectStyles(selector) {
-	if (!_isValidCssSelector(selector)) return '';
+	if (!_isValidCssSelector(selector)) return;
 	const finalSelector = unsafeCSS(selector);
 	const selectFocusStyles = _getSelectFocusStyles(finalSelector);
 

package/components/inputs/input-styles.js

@@ -125,7 +125,7 @@ function _generatewebkitSearchStyles(selector) {
  * A private helper method that should not be used by general consumers
  */
 export function _generateInputStyles(selector, focusSelector) {
-	if (!_isValidCssSelector(selector) || (focusSelector && !_isValidCssSelector(focusSelector))) return '';
+	if (!_isValidCssSelector(selector) || (focusSelector && !_isValidCssSelector(focusSelector))) return;
 	const lastSpaceIndex = selector.lastIndexOf(' ');
 	const textareaSelector = unsafeCSS(`${selector.substring(0, lastSpaceIndex + 1)}textarea${selector.substring(lastSpaceIndex + 1)}`);
 	const delegates = getStyleDelegates(selector, focusSelector, textareaSelector);
@@ -191,7 +191,7 @@ export function _generateInputStyles(selector, focusSelector) {
  * A private helper method that should not be used by general consumers
  */
 export function _generateInputTextStyles(selector) {
-	if (!_isValidCssSelector(selector)) return '';
+	if (!_isValidCssSelector(selector)) return;
 	const finalSelector = unsafeCSS(selector);
 	const input = _getInputBaseStyleDelegates(selector);
 

package/components/page/page-divider-internal.js

@@ -13,8 +13,8 @@ export const KEYBOARD_STEP = 20; // TO DO: Confirm
 export const KEYBOARD_STEP_LARGE = 80; // TO DO: Confirm
 
 const DRAG_THRESHOLD = 3; // Number of pixels to move to count as a drag
-const AUTO_EXPAND_WIDTH_FACTOR = 0.1;
-const AUTO_COLLAPSE_WIDTH_FACTOR = 0.75;
+export const AUTO_EXPAND_WIDTH_FACTOR = 0.1;
+export const AUTO_COLLAPSE_WIDTH_FACTOR = 0.75;
 
 const clampedSize = (size, min, max) => Math.max(min, Math.min(size, max));
 const isRtl = () => document.documentElement.getAttribute('dir') === 'rtl';

package/custom-elements.json

@@ -4563,10 +4563,20 @@
           "description": "REQUIRED: The action text to be used in the subtle button",
           "type": "string"
         },
+        {
+          "name": "download",
+          "description": "Prompts the user to save the linked URL instead of navigating to it.\nMust be to a resource on the same origin.\nCan be used with or without a value, when set the value becomes the filename.",
+          "type": "string"
+        },
         {
           "name": "href",
           "description": "REQUIRED: The action URL or URL fragment of the link",
           "type": "string"
+        },
+        {
+          "name": "target",
+          "description": "Where to display the linked URL",
+          "type": "string"
         }
       ],
       "properties": [
@@ -4576,16 +4586,28 @@
           "description": "REQUIRED: The action text to be used in the subtle button",
           "type": "string"
         },
+        {
+          "name": "download",
+          "attribute": "download",
+          "description": "Prompts the user to save the linked URL instead of navigating to it.\nMust be to a resource on the same origin.\nCan be used with or without a value, when set the value becomes the filename.",
+          "type": "string"
+        },
         {
           "name": "href",
           "attribute": "href",
           "description": "REQUIRED: The action URL or URL fragment of the link",
           "type": "string"
         },
+        {
+          "name": "target",
+          "attribute": "target",
+          "description": "Where to display the linked URL",
+          "type": "string"
+        },
         {
           "name": "styles",
           "type": "array",
-          "default": "[\"bodyCompactStyles\",\"linkStyles\"]"
+          "default": "[\"styles\",\"bodyCompactStyles\",\"linkStyles\"]"
         }
       ]
     },

package/package.json

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