@brightspace-ui/core 3.282.0 → 3.283.0

package/helpers/README.md

@@ -86,18 +86,25 @@ elemIdListRemoves(node, attrName, value);
 findComposedAncestor(node, predicate);
 
 // gets the composed children (including shadow children & distributed children)
-// includes a predicate which will add children nodes when predicate(node) is true
+// includes optional predicate for filtering child elements
 getComposedChildren(element, predicate = () => true);
 
+// gets the composed next element sibling considing how children are distributed into slots
+// includes optional predicate for filtering elements
+getComposedNextElementSibling(node, { predicate } = {}) {
+
 // gets the composed parent (including shadow host & insertion points)
 getComposedParent(node);
 
+// returns the first visible ancestor of the given node
+getFirstVisibleAncestor(node)
+
 // returns the next composed sibling at least one dom level up
-// includes a predicate which will return the node when predicate(node) is true
+// includes optional predicate for filtering elements
 getNextAncestorSibling(node, predicate = () => true);
 
 // returns the previous composed sibling at least one dom level up
-// includes a predicate which will return the node when predicate(node) is true
+// includes optional predicate for filtering elements
 getPreviousAncestorSibling(node, predicate = () => true);
 
 // browser consistent implementation of HTMLElement.offsetParent
@@ -109,9 +116,6 @@ isComposedAncestor(ancestorNode, node);
 // returns true/false whether the element is visible regardless of positioning
 isVisible(node, { checkAncestors: true });
 
-// returns the first visible ancestor of the given node
-getFirstVisibleAncestor(node)
-
 // similar to document.querySelector or element.querySelector,
 // except it queries not just the light DOM but also shadow DOM
 querySelectorComposed(node, selector)

package/helpers/dom.js

@@ -79,40 +79,65 @@ export function getBoundingAncestor(node) {
 	});
 }
 
-export function getComposedChildren(node, predicate = () => true) {
+function getComposedChildNodes(node, { elementsOnly = false, predicate } = {}) {
 
-	if (!node) {
-		return null;
-	}
-	if (node.nodeType !== Node.ELEMENT_NODE && node.nodeType !== Node.DOCUMENT_NODE && node.nodeType !== Node.DOCUMENT_FRAGMENT_NODE) {
+	if (!node) return null;
+
+	if (node.nodeType !== Node.ELEMENT_NODE
+		&& node.nodeType !== Node.DOCUMENT_NODE
+		&& node.nodeType !== Node.DOCUMENT_FRAGMENT_NODE) {
 		return null;
 	}
 
 	let nodes;
-	const children = [];
+	const filteredNodes = [];
 
 	if (node.tagName === 'CONTENT') {
 		nodes = node.getDistributedNodes();
 	} else if (node.tagName === 'SLOT') {
 		// note: this is not handling default slot content
-		nodes = node.assignedNodes({ flatten: true });
+		nodes = elementsOnly ? node.assignedElements({ flatten: true }) : node.assignedNodes({ flatten: true });
 	} else {
-		if (node.shadowRoot) {
-			node = node.shadowRoot;
-		}
-		nodes = node.children || node.childNodes;
+		if (node.shadowRoot) node = node.shadowRoot;
+		nodes = elementsOnly ? node.children : node.childNodes;
 	}
 
 	for (let i = 0; i < nodes.length; i++) {
-		if (nodes[i].nodeType === Node.ELEMENT_NODE) {
-			if (predicate(nodes[i])) {
-				children.push(nodes[i]);
-			}
+		// need to check nodeType since old Polymer getDistributedNodes could return non-elements
+		if (!elementsOnly || nodes[i].nodeType === Node.ELEMENT_NODE) {
+			if (!predicate || predicate(nodes[i])) filteredNodes.push(nodes[i]);
 		}
 	}
 
-	return children;
+	return filteredNodes;
+}
+
+export function getComposedChildren(node, predicate) {
+	return getComposedChildNodes(node, { elementsOnly: true, predicate });
+}
+
+export function getComposedNextElementSibling(node, { predicate } = {}) {
 
+	if (!node || node.nodeType === undefined) return null;
+
+	const parentNode = getComposedParent(node);
+	if (!parentNode) return null;
+
+	// for regular parents this is child elements; for SLOT this is distributed elements
+	const composedChildNodes = getComposedChildNodes(parentNode, { elementsOnly: (node.nodeType === Node.ELEMENT_NODE) });
+
+	if (!composedChildNodes || composedChildNodes.length === 0) return null;
+
+	const index = composedChildNodes.indexOf(node);
+	if (index === -1) return null;
+
+	for (let i = index + 1; i < composedChildNodes.length; i++) {
+		if (composedChildNodes[i].nodeType === Node.ELEMENT_NODE && (!predicate || predicate(composedChildNodes[i]))) {
+			return composedChildNodes[i];
+		}
+	}
+
+	return null;
 }
 
 export function getComposedParent(node) {

package/package.json

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