@oscarpalmer/toretto 0.7.0 → 0.9.0

package/dist/focusable.js

@@ -0,0 +1,152 @@
+// src/focusable.ts
+function getFocusable(parent) {
+  return getValidElements(parent, focusableFilters, false);
+}
+function getItem(element, tabbable) {
+  return {
+    element,
+    tabIndex: tabbable ? getTabIndex(element) : -1
+  };
+}
+function getTabbable(parent) {
+  return getValidElements(parent, tabbableFilters, true);
+}
+function getTabIndex(element) {
+  const tabIndex = element?.tabIndex ?? -1;
+  if (tabIndex < 0 && (/^(audio|details|video)$/i.test(element.tagName) || isEditable(element)) && !hasTabIndex(element)) {
+    return 0;
+  }
+  return tabIndex;
+}
+function getValidElements(parent, filters, tabbable) {
+  const elements = [...parent.querySelectorAll(selector)];
+  const items = [];
+  let { length } = elements;
+  for (let index = 0;index < length; index += 1) {
+    const item = getItem(elements[index], tabbable);
+    if (!filters.some((filter) => filter(item))) {
+      items.push(item);
+    }
+  }
+  if (!tabbable) {
+    return items.map((item) => item.element);
+  }
+  const indiced = [];
+  const zeroed = [];
+  length = items.length;
+  for (let index = 0;index < length; index += 1) {
+    const item = items[index];
+    if (item.tabIndex === 0) {
+      zeroed.push(item.element);
+    } else {
+      indiced[item.tabIndex] = [
+        ...indiced[item.tabIndex] ?? [],
+        item.element
+      ];
+    }
+  }
+  return [...indiced.flat(), ...zeroed];
+}
+function hasTabIndex(element) {
+  return !Number.isNaN(Number.parseInt(element.getAttribute("tabindex"), 10));
+}
+function isDisabled(item) {
+  if (/^(button|input|select|textarea)$/i.test(item.element.tagName) && isDisabledFromFieldset(item.element)) {
+    return true;
+  }
+  return (item.element.disabled ?? false) || item.element.getAttribute("aria-disabled") === "true";
+}
+function isDisabledFromFieldset(element) {
+  let parent = element.parentElement;
+  while (parent != null) {
+    if (parent instanceof HTMLFieldSetElement && parent.disabled) {
+      const children = Array.from(parent.children);
+      const { length } = children;
+      for (let index = 0;index < length; index += 1) {
+        const child = children[index];
+        if (child instanceof HTMLLegendElement) {
+          return parent.matches("fieldset[disabled] *") ? true : !child.contains(element);
+        }
+      }
+      return true;
+    }
+    parent = parent.parentElement;
+  }
+  return false;
+}
+function isEditable(element) {
+  return /^(|true)$/i.test(element.getAttribute("contenteditable"));
+}
+function isFocusable(element) {
+  return isValidElement(element, focusableFilters, false);
+}
+function isHidden(item) {
+  if ((item.element.hidden ?? false) || item.element instanceof HTMLInputElement && item.element.type === "hidden") {
+    return true;
+  }
+  const isDirectSummary = item.element.matches("details > summary:first-of-type");
+  const nodeUnderDetails = isDirectSummary ? item.element.parentElement : item.element;
+  if (nodeUnderDetails?.matches("details:not([open]) *") ?? false) {
+    return true;
+  }
+  const style = getComputedStyle(item.element);
+  if (style.display === "none" || style.visibility === "hidden") {
+    return true;
+  }
+  const { height, width } = item.element.getBoundingClientRect();
+  return height === 0 && width === 0;
+}
+function isInert(item) {
+  return (item.element.inert ?? false) || /^(|true)$/i.test(item.element.getAttribute("inert")) || item.element.parentElement != null && isInert({
+    element: item.element.parentElement,
+    tabIndex: -1
+  });
+}
+function isNotTabbable(item) {
+  return (item.tabIndex ?? -1) < 0;
+}
+function isNotTabbableRadio(item) {
+  if (!(item.element instanceof HTMLInputElement) || item.element.type !== "radio" || !item.element.name || item.element.checked) {
+    return false;
+  }
+  const parent = item.element.form ?? item.element.getRootNode?.() ?? item.element.ownerDocument;
+  const realName = CSS?.escape?.(item.element.name) ?? item.element.name;
+  const radios = Array.from(parent.querySelectorAll(`input[type="radio"][name="${realName}"]`));
+  const checked = radios.find((radio) => radio.checked);
+  return checked != null && checked !== item.element;
+}
+function isSummarised(item) {
+  return item.element instanceof HTMLDetailsElement && Array.from(item.element.children).some((child) => /^summary$/i.test(child.tagName));
+}
+function isTabbable(element) {
+  return isValidElement(element, tabbableFilters, true);
+}
+function isValidElement(element, filters, tabbable) {
+  const item = getItem(element, tabbable);
+  return !filters.some((filter) => filter(item));
+}
+var focusableFilters = [isDisabled, isInert, isHidden, isSummarised];
+var selector = [
+  '[contenteditable]:not([contenteditable="false"])',
+  "[tabindex]:not(slot)",
+  "a[href]",
+  "audio[controls]",
+  "button",
+  "details",
+  "details > summary:first-of-type",
+  "input",
+  "select",
+  "textarea",
+  "video[controls]"
+].map((selector2) => `${selector2}:not([inert])`).join(",");
+var tabbableFilters = [
+  isNotTabbable,
+  isNotTabbableRadio,
+  ...focusableFilters
+];
+export {
+  isTabbable,
+  isFocusable,
+  getTabbable,
+  getFocusable
+};

package/dist/focusable.mjs

@@ -0,0 +1,152 @@
+// src/focusable.ts
+function getFocusable(parent) {
+  return getValidElements(parent, focusableFilters, false);
+}
+function getItem(element, tabbable) {
+  return {
+    element,
+    tabIndex: tabbable ? getTabIndex(element) : -1
+  };
+}
+function getTabbable(parent) {
+  return getValidElements(parent, tabbableFilters, true);
+}
+function getTabIndex(element) {
+  const tabIndex = element?.tabIndex ?? -1;
+  if (tabIndex < 0 && (/^(audio|details|video)$/i.test(element.tagName) || isEditable(element)) && !hasTabIndex(element)) {
+    return 0;
+  }
+  return tabIndex;
+}
+function getValidElements(parent, filters, tabbable) {
+  const elements = [...parent.querySelectorAll(selector)];
+  const items = [];
+  let { length } = elements;
+  for (let index = 0;index < length; index += 1) {
+    const item = getItem(elements[index], tabbable);
+    if (!filters.some((filter) => filter(item))) {
+      items.push(item);
+    }
+  }
+  if (!tabbable) {
+    return items.map((item) => item.element);
+  }
+  const indiced = [];
+  const zeroed = [];
+  length = items.length;
+  for (let index = 0;index < length; index += 1) {
+    const item = items[index];
+    if (item.tabIndex === 0) {
+      zeroed.push(item.element);
+    } else {
+      indiced[item.tabIndex] = [
+        ...indiced[item.tabIndex] ?? [],
+        item.element
+      ];
+    }
+  }
+  return [...indiced.flat(), ...zeroed];
+}
+function hasTabIndex(element) {
+  return !Number.isNaN(Number.parseInt(element.getAttribute("tabindex"), 10));
+}
+function isDisabled(item) {
+  if (/^(button|input|select|textarea)$/i.test(item.element.tagName) && isDisabledFromFieldset(item.element)) {
+    return true;
+  }
+  return (item.element.disabled ?? false) || item.element.getAttribute("aria-disabled") === "true";
+}
+function isDisabledFromFieldset(element) {
+  let parent = element.parentElement;
+  while (parent != null) {
+    if (parent instanceof HTMLFieldSetElement && parent.disabled) {
+      const children = Array.from(parent.children);
+      const { length } = children;
+      for (let index = 0;index < length; index += 1) {
+        const child = children[index];
+        if (child instanceof HTMLLegendElement) {
+          return parent.matches("fieldset[disabled] *") ? true : !child.contains(element);
+        }
+      }
+      return true;
+    }
+    parent = parent.parentElement;
+  }
+  return false;
+}
+function isEditable(element) {
+  return /^(|true)$/i.test(element.getAttribute("contenteditable"));
+}
+function isFocusable(element) {
+  return isValidElement(element, focusableFilters, false);
+}
+function isHidden(item) {
+  if ((item.element.hidden ?? false) || item.element instanceof HTMLInputElement && item.element.type === "hidden") {
+    return true;
+  }
+  const isDirectSummary = item.element.matches("details > summary:first-of-type");
+  const nodeUnderDetails = isDirectSummary ? item.element.parentElement : item.element;
+  if (nodeUnderDetails?.matches("details:not([open]) *") ?? false) {
+    return true;
+  }
+  const style = getComputedStyle(item.element);
+  if (style.display === "none" || style.visibility === "hidden") {
+    return true;
+  }
+  const { height, width } = item.element.getBoundingClientRect();
+  return height === 0 && width === 0;
+}
+function isInert(item) {
+  return (item.element.inert ?? false) || /^(|true)$/i.test(item.element.getAttribute("inert")) || item.element.parentElement != null && isInert({
+    element: item.element.parentElement,
+    tabIndex: -1
+  });
+}
+function isNotTabbable(item) {
+  return (item.tabIndex ?? -1) < 0;
+}
+function isNotTabbableRadio(item) {
+  if (!(item.element instanceof HTMLInputElement) || item.element.type !== "radio" || !item.element.name || item.element.checked) {
+    return false;
+  }
+  const parent = item.element.form ?? item.element.getRootNode?.() ?? item.element.ownerDocument;
+  const realName = CSS?.escape?.(item.element.name) ?? item.element.name;
+  const radios = Array.from(parent.querySelectorAll(`input[type="radio"][name="${realName}"]`));
+  const checked = radios.find((radio) => radio.checked);
+  return checked != null && checked !== item.element;
+}
+function isSummarised(item) {
+  return item.element instanceof HTMLDetailsElement && Array.from(item.element.children).some((child) => /^summary$/i.test(child.tagName));
+}
+function isTabbable(element) {
+  return isValidElement(element, tabbableFilters, true);
+}
+function isValidElement(element, filters, tabbable) {
+  const item = getItem(element, tabbable);
+  return !filters.some((filter) => filter(item));
+}
+var focusableFilters = [isDisabled, isInert, isHidden, isSummarised];
+var selector = [
+  '[contenteditable]:not([contenteditable="false"])',
+  "[tabindex]:not(slot)",
+  "a[href]",
+  "audio[controls]",
+  "button",
+  "details",
+  "details > summary:first-of-type",
+  "input",
+  "select",
+  "textarea",
+  "video[controls]"
+].map((selector2) => `${selector2}:not([inert])`).join(",");
+var tabbableFilters = [
+  isNotTabbable,
+  isNotTabbableRadio,
+  ...focusableFilters
+];
+export {
+  isTabbable,
+  isFocusable,
+  getTabbable,
+  getFocusable
+};

package/dist/index.js

@@ -291,6 +291,180 @@ function traverse(from, to) {
   }
   return -1e6;
 }
+// src/focusable.ts
+function getFocusable(parent) {
+  return getValidElements(parent, focusableFilters, false);
+}
+function getItem(element, tabbable) {
+  return {
+    element,
+    tabIndex: tabbable ? getTabIndex(element) : -1
+  };
+}
+function getTabbable(parent) {
+  return getValidElements(parent, tabbableFilters, true);
+}
+function getTabIndex(element) {
+  const tabIndex = element?.tabIndex ?? -1;
+  if (tabIndex < 0 && (/^(audio|details|video)$/i.test(element.tagName) || isEditable(element)) && !hasTabIndex(element)) {
+    return 0;
+  }
+  return tabIndex;
+}
+function getValidElements(parent, filters, tabbable) {
+  const elements = [...parent.querySelectorAll(selector)];
+  const items = [];
+  let { length } = elements;
+  for (let index = 0;index < length; index += 1) {
+    const item = getItem(elements[index], tabbable);
+    if (!filters.some((filter2) => filter2(item))) {
+      items.push(item);
+    }
+  }
+  if (!tabbable) {
+    return items.map((item) => item.element);
+  }
+  const indiced = [];
+  const zeroed = [];
+  length = items.length;
+  for (let index = 0;index < length; index += 1) {
+    const item = items[index];
+    if (item.tabIndex === 0) {
+      zeroed.push(item.element);
+    } else {
+      indiced[item.tabIndex] = [
+        ...indiced[item.tabIndex] ?? [],
+        item.element
+      ];
+    }
+  }
+  return [...indiced.flat(), ...zeroed];
+}
+function hasTabIndex(element) {
+  return !Number.isNaN(Number.parseInt(element.getAttribute("tabindex"), 10));
+}
+function isDisabled(item) {
+  if (/^(button|input|select|textarea)$/i.test(item.element.tagName) && isDisabledFromFieldset(item.element)) {
+    return true;
+  }
+  return (item.element.disabled ?? false) || item.element.getAttribute("aria-disabled") === "true";
+}
+function isDisabledFromFieldset(element) {
+  let parent = element.parentElement;
+  while (parent != null) {
+    if (parent instanceof HTMLFieldSetElement && parent.disabled) {
+      const children = Array.from(parent.children);
+      const { length } = children;
+      for (let index = 0;index < length; index += 1) {
+        const child = children[index];
+        if (child instanceof HTMLLegendElement) {
+          return parent.matches("fieldset[disabled] *") ? true : !child.contains(element);
+        }
+      }
+      return true;
+    }
+    parent = parent.parentElement;
+  }
+  return false;
+}
+function isEditable(element) {
+  return /^(|true)$/i.test(element.getAttribute("contenteditable"));
+}
+function isFocusable(element) {
+  return isValidElement(element, focusableFilters, false);
+}
+function isHidden(item) {
+  if ((item.element.hidden ?? false) || item.element instanceof HTMLInputElement && item.element.type === "hidden") {
+    return true;
+  }
+  const isDirectSummary = item.element.matches("details > summary:first-of-type");
+  const nodeUnderDetails = isDirectSummary ? item.element.parentElement : item.element;
+  if (nodeUnderDetails?.matches("details:not([open]) *") ?? false) {
+    return true;
+  }
+  const style = getComputedStyle(item.element);
+  if (style.display === "none" || style.visibility === "hidden") {
+    return true;
+  }
+  const { height, width } = item.element.getBoundingClientRect();
+  return height === 0 && width === 0;
+}
+function isInert(item) {
+  return (item.element.inert ?? false) || /^(|true)$/i.test(item.element.getAttribute("inert")) || item.element.parentElement != null && isInert({
+    element: item.element.parentElement,
+    tabIndex: -1
+  });
+}
+function isNotTabbable(item) {
+  return (item.tabIndex ?? -1) < 0;
+}
+function isNotTabbableRadio(item) {
+  if (!(item.element instanceof HTMLInputElement) || item.element.type !== "radio" || !item.element.name || item.element.checked) {
+    return false;
+  }
+  const parent = item.element.form ?? item.element.getRootNode?.() ?? item.element.ownerDocument;
+  const realName = CSS?.escape?.(item.element.name) ?? item.element.name;
+  const radios = Array.from(parent.querySelectorAll(`input[type="radio"][name="${realName}"]`));
+  const checked = radios.find((radio) => radio.checked);
+  return checked != null && checked !== item.element;
+}
+function isSummarised(item) {
+  return item.element instanceof HTMLDetailsElement && Array.from(item.element.children).some((child) => /^summary$/i.test(child.tagName));
+}
+function isTabbable(element) {
+  return isValidElement(element, tabbableFilters, true);
+}
+function isValidElement(element, filters, tabbable) {
+  const item = getItem(element, tabbable);
+  return !filters.some((filter2) => filter2(item));
+}
+var focusableFilters = [isDisabled, isInert, isHidden, isSummarised];
+var selector = [
+  '[contenteditable]:not([contenteditable="false"])',
+  "[tabindex]:not(slot)",
+  "a[href]",
+  "audio[controls]",
+  "button",
+  "details",
+  "details > summary:first-of-type",
+  "input",
+  "select",
+  "textarea",
+  "video[controls]"
+].map((selector2) => `${selector2}:not([inert])`).join(",");
+var tabbableFilters = [
+  isNotTabbable,
+  isNotTabbableRadio,
+  ...focusableFilters
+];
+// src/sanitise.ts
+function sanitise(value2, options) {
+  return sanitiseNodes(Array.isArray(value2) ? value2 : [value2], {
+    sanitiseBooleanAttributes: options?.sanitiseBooleanAttributes ?? true
+  });
+}
+function sanitiseAttributes(element, attributes, options) {
+  const { length } = attributes;
+  for (let index = 0;index < length; index += 1) {
+    const attribute2 = attributes[index];
+    if (isBadAttribute(attribute2) || isEmptyNonBooleanAttribute(attribute2)) {
+      element.removeAttribute(attribute2.name);
+    } else if (options.sanitiseBooleanAttributes && isInvalidBooleanAttribute(attribute2)) {
+      element.setAttribute(attribute2.name, "");
+    }
+  }
+}
+function sanitiseNodes(nodes, options) {
+  const { length } = nodes;
+  for (let index = 0;index < length; index += 1) {
+    const node = nodes[index];
+    if (node instanceof Element) {
+      sanitiseAttributes(node, [...node.attributes], options);
+    }
+    sanitiseNodes([...node.childNodes], options);
+  }
+  return nodes;
+}
 // src/style.ts
 function getStyle(element, property) {
   return element.style[property];
@@ -306,7 +480,7 @@ function getStyles(element, properties) {
 }
 function getTextDirection(element) {
   const direction = element.getAttribute("dir");
-  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+  if (direction != null && /^(ltr|rtl)$/i.test(direction)) {
     return direction.toLowerCase();
   }
   return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";
@@ -330,13 +504,18 @@ export {
   setData,
   setAttributes,
   setAttribute,
+  sanitise,
+  isTabbable,
   isInvalidBooleanAttribute,
+  isFocusable,
   isEmptyNonBooleanAttribute,
   isBooleanAttribute,
   isBadAttribute,
   getTextDirection,
+  getTabbable,
   getStyles,
   getStyle,
+  getFocusable,
   getElementUnderPointer,
   getData,
   findRelatives,

package/dist/index.mjs

@@ -2,5 +2,7 @@
 export * from "./attribute";
 export * from "./data";
 export * from "./find";
+export * from "./focusable";
 export * from "./models";
+export * from "./sanitise";
 export * from "./style";

package/dist/sanitise.js

@@ -0,0 +1,75 @@
+// src/attribute.ts
+function isBadAttribute(attribute) {
+  return onPrefix.test(attribute.name) || sourcePrefix.test(attribute.name) && valuePrefix.test(attribute.value);
+}
+function isEmptyNonBooleanAttribute(attribute) {
+  return !booleanAttributes.includes(attribute.name) && attribute.value.trim().length === 0;
+}
+function isInvalidBooleanAttribute(attribute) {
+  if (!booleanAttributes.includes(attribute.name)) {
+    return true;
+  }
+  const normalised = attribute.value.toLowerCase().trim();
+  return !(normalised.length === 0 || normalised === attribute.name || attribute.name === "hidden" && normalised === "until-found");
+}
+var booleanAttributes = Object.freeze([
+  "async",
+  "autofocus",
+  "autoplay",
+  "checked",
+  "controls",
+  "default",
+  "defer",
+  "disabled",
+  "formnovalidate",
+  "hidden",
+  "inert",
+  "ismap",
+  "itemscope",
+  "loop",
+  "multiple",
+  "muted",
+  "nomodule",
+  "novalidate",
+  "open",
+  "playsinline",
+  "readonly",
+  "required",
+  "reversed",
+  "selected"
+]);
+var onPrefix = /^on/i;
+var sourcePrefix = /^(href|src|xlink:href)$/i;
+var valuePrefix = /(data:text\/html|javascript:)/i;
+
+// src/sanitise.ts
+function sanitise(value2, options) {
+  return sanitiseNodes(Array.isArray(value2) ? value2 : [value2], {
+    sanitiseBooleanAttributes: options?.sanitiseBooleanAttributes ?? true
+  });
+}
+function sanitiseAttributes(element, attributes, options) {
+  const { length } = attributes;
+  for (let index = 0;index < length; index += 1) {
+    const attribute2 = attributes[index];
+    if (isBadAttribute(attribute2) || isEmptyNonBooleanAttribute(attribute2)) {
+      element.removeAttribute(attribute2.name);
+    } else if (options.sanitiseBooleanAttributes && isInvalidBooleanAttribute(attribute2)) {
+      element.setAttribute(attribute2.name, "");
+    }
+  }
+}
+function sanitiseNodes(nodes, options) {
+  const { length } = nodes;
+  for (let index = 0;index < length; index += 1) {
+    const node = nodes[index];
+    if (node instanceof Element) {
+      sanitiseAttributes(node, [...node.attributes], options);
+    }
+    sanitiseNodes([...node.childNodes], options);
+  }
+  return nodes;
+}
+export {
+  sanitise
+};

package/dist/sanitise.mjs

@@ -0,0 +1,36 @@
+// src/sanitise.ts
+import {
+isBadAttribute,
+isEmptyNonBooleanAttribute,
+isInvalidBooleanAttribute
+} from "./attribute";
+function sanitise(value, options) {
+  return sanitiseNodes(Array.isArray(value) ? value : [value], {
+    sanitiseBooleanAttributes: options?.sanitiseBooleanAttributes ?? true
+  });
+}
+function sanitiseAttributes(element, attributes, options) {
+  const { length } = attributes;
+  for (let index = 0;index < length; index += 1) {
+    const attribute2 = attributes[index];
+    if (isBadAttribute(attribute2) || isEmptyNonBooleanAttribute(attribute2)) {
+      element.removeAttribute(attribute2.name);
+    } else if (options.sanitiseBooleanAttributes && isInvalidBooleanAttribute(attribute2)) {
+      element.setAttribute(attribute2.name, "");
+    }
+  }
+}
+function sanitiseNodes(nodes, options) {
+  const { length } = nodes;
+  for (let index = 0;index < length; index += 1) {
+    const node = nodes[index];
+    if (node instanceof Element) {
+      sanitiseAttributes(node, [...node.attributes], options);
+    }
+    sanitiseNodes([...node.childNodes], options);
+  }
+  return nodes;
+}
+export {
+  sanitise
+};

package/dist/style.js

@@ -58,7 +58,7 @@ function getStyles(element, properties) {
 }
 function getTextDirection(element) {
   const direction = element.getAttribute("dir");
-  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+  if (direction != null && /^(ltr|rtl)$/i.test(direction)) {
     return direction.toLowerCase();
   }
   return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";

package/dist/style.mjs

@@ -14,7 +14,7 @@ function getStyles(element, properties) {
 }
 function getTextDirection(element) {
   const direction = element.getAttribute("dir");
-  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+  if (direction != null && /^(ltr|rtl)$/i.test(direction)) {
     return direction.toLowerCase();
   }
   return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";

package/package.json

@@ -45,10 +45,22 @@
 			"import": "./dist/find.mjs",
 			"require": "./dist/find.js"
 		},
+		"./focusable": {
+			"types": "./types/focusable.d.ts",
+			"bun": "./src/focusable.ts",
+			"import": "./dist/focusable.mjs",
+			"require": "./dist/focusable.js"
+		},
 		"./models": {
 			"types": "./types/models.d.ts",
 			"bun": "./src/models.ts"
 		},
+		"./sanitise": {
+			"types": "./types/sanitise.d.ts",
+			"bun": "./src/sanitise.ts",
+			"import": "./dist/sanitise.mjs",
+			"require": "./dist/sanitise.js"
+		},
 		"./style": {
 			"types": "./types/style.d.ts",
 			"bun": "./src/style.ts",
@@ -85,5 +97,5 @@
 	},
 	"type": "module",
 	"types": "types/index.d.cts",
-	"version": "0.7.0"
+	"version": "0.9.0"
 }

package/src/focusable.ts

@@ -0,0 +1,270 @@
+// Based on https://github.com/focus-trap/tabbable :-)
+
+type ElementWithTabIndex = {
+	element: Element;
+	tabIndex: number;
+};
+
+type Filter = (item: ElementWithTabIndex) => boolean;
+type InertElement = Element & {inert: boolean};
+
+const focusableFilters = [isDisabled, isInert, isHidden, isSummarised];
+
+const selector = [
+	'[contenteditable]:not([contenteditable="false"])',
+	'[tabindex]:not(slot)',
+	'a[href]',
+	'audio[controls]',
+	'button',
+	'details',
+	'details > summary:first-of-type',
+	'input',
+	'select',
+	'textarea',
+	'video[controls]',
+]
+	.map(selector => `${selector}:not([inert])`)
+	.join(',');
+
+const tabbableFilters = [
+	isNotTabbable,
+	isNotTabbableRadio,
+	...focusableFilters,
+];
+
+/**
+ * Get a list of focusable elements within a parent element
+ */
+export function getFocusable(parent: Element): Element[] {
+	return getValidElements(parent, focusableFilters, false);
+}
+
+function getItem(element: Element, tabbable: boolean): ElementWithTabIndex {
+	return {
+		element,
+		tabIndex: tabbable ? getTabIndex(element) : -1,
+	};
+}
+
+/**
+ * Get a list of tabbable elements within a parent element
+ */
+export function getTabbable(parent: Element): Element[] {
+	return getValidElements(parent, tabbableFilters, true);
+}
+
+function getTabIndex(element: Element): number {
+	const tabIndex = (element as HTMLElement)?.tabIndex ?? -1;
+
+	if (
+		tabIndex < 0 &&
+		(/^(audio|details|video)$/i.test(element.tagName) || isEditable(element)) &&
+		!hasTabIndex(element)
+	) {
+		return 0;
+	}
+
+	return tabIndex;
+}
+
+function getValidElements(
+	parent: Element,
+	filters: Filter[],
+	tabbable: boolean,
+): Array<Element> {
+	const elements = [...parent.querySelectorAll(selector)];
+	const items: ElementWithTabIndex[] = [];
+
+	let {length} = elements;
+
+	for (let index = 0; index < length; index += 1) {
+		const item = getItem(elements[index], tabbable);
+
+		if (!filters.some(filter => filter(item))) {
+			items.push(item);
+		}
+	}
+
+	if (!tabbable) {
+		return items.map(item => item.element);
+	}
+
+	const indiced: Array<Array<Element>> = [];
+	const zeroed: Array<Element> = [];
+
+	length = items.length;
+
+	for (let index = 0; index < length; index += 1) {
+		const item = items[index];
+
+		if (item.tabIndex === 0) {
+			zeroed.push(item.element);
+		} else {
+			indiced[item.tabIndex] = [
+				...(indiced[item.tabIndex] ?? []),
+				item.element,
+			];
+		}
+	}
+
+	return [...indiced.flat(), ...zeroed];
+}
+
+function hasTabIndex(element: Element): boolean {
+	return !Number.isNaN(
+		Number.parseInt(element.getAttribute('tabindex') as string, 10),
+	);
+}
+
+function isDisabled(item: ElementWithTabIndex): boolean {
+	if (
+		/^(button|input|select|textarea)$/i.test(item.element.tagName) &&
+		isDisabledFromFieldset(item.element)
+	) {
+		return true;
+	}
+
+	return (
+		((item.element as HTMLInputElement).disabled ?? false) ||
+		item.element.getAttribute('aria-disabled') === 'true'
+	);
+}
+
+function isDisabledFromFieldset(element: Element): boolean {
+	let parent = element.parentElement;
+
+	while (parent != null) {
+		if (parent instanceof HTMLFieldSetElement && parent.disabled) {
+			const children = Array.from(parent.children);
+			const {length} = children;
+
+			for (let index = 0; index < length; index += 1) {
+				const child = children[index];
+
+				if (child instanceof HTMLLegendElement) {
+					return parent.matches('fieldset[disabled] *')
+						? true
+						: !child.contains(element);
+				}
+			}
+
+			return true;
+		}
+
+		parent = parent.parentElement;
+	}
+
+	return false;
+}
+
+function isEditable(element: Element): boolean {
+	return /^(|true)$/i.test(element.getAttribute('contenteditable') as string);
+}
+
+/**
+ * Is the element focusable?
+ */
+export function isFocusable(element: Element): boolean {
+	return isValidElement(element, focusableFilters, false);
+}
+
+function isHidden(item: ElementWithTabIndex) {
+	if (
+		((item.element as HTMLElement).hidden ?? false) ||
+		(item.element instanceof HTMLInputElement && item.element.type === 'hidden')
+	) {
+		return true;
+	}
+
+	const isDirectSummary = item.element.matches(
+		'details > summary:first-of-type',
+	);
+
+	const nodeUnderDetails = isDirectSummary
+		? item.element.parentElement
+		: item.element;
+
+	if (nodeUnderDetails?.matches('details:not([open]) *') ?? false) {
+		return true;
+	}
+
+	const style = getComputedStyle(item.element);
+
+	if (style.display === 'none' || style.visibility === 'hidden') {
+		return true;
+	}
+
+	const {height, width} = item.element.getBoundingClientRect();
+
+	return height === 0 && width === 0;
+}
+
+function isInert(item: ElementWithTabIndex): boolean {
+	return (
+		((item.element as InertElement).inert ?? false) ||
+		/^(|true)$/i.test(item.element.getAttribute('inert') as string) ||
+		(item.element.parentElement != null &&
+			isInert({
+				element: item.element.parentElement,
+				tabIndex: -1,
+			}))
+	);
+}
+
+function isNotTabbable(item: ElementWithTabIndex) {
+	return (item.tabIndex ?? -1) < 0;
+}
+
+function isNotTabbableRadio(item: ElementWithTabIndex): boolean {
+	if (
+		!(item.element instanceof HTMLInputElement) ||
+		item.element.type !== 'radio' ||
+		!item.element.name ||
+		item.element.checked
+	) {
+		return false;
+	}
+
+	const parent =
+		item.element.form ??
+		item.element.getRootNode?.() ??
+		item.element.ownerDocument;
+
+	const realName = CSS?.escape?.(item.element.name) ?? item.element.name;
+
+	const radios = Array.from(
+		(parent as Element).querySelectorAll(
+			`input[type="radio"][name="${realName}"]`,
+		),
+	) as HTMLInputElement[];
+
+	const checked = radios.find(radio => radio.checked);
+
+	return checked != null && checked !== item.element;
+}
+
+function isSummarised(item: ElementWithTabIndex) {
+	return (
+		item.element instanceof HTMLDetailsElement &&
+		Array.from(item.element.children).some(child =>
+			/^summary$/i.test(child.tagName),
+		)
+	);
+}
+
+/**
+ * Is the element tabbable?
+ */
+export function isTabbable(element: Element): boolean {
+	return isValidElement(element, tabbableFilters, true);
+}
+
+function isValidElement(
+	element: Element,
+	filters: Filter[],
+	tabbable: boolean,
+): boolean {
+	const item = getItem(element, tabbable);
+
+	return !filters.some(filter => filter(item));
+}

package/src/index.ts

@@ -1,5 +1,7 @@
 export * from './attribute';
 export * from './data';
 export * from './find';
+export * from './focusable';
 export * from './models';
+export * from './sanitise';
 export * from './style';

package/src/sanitise.ts

@@ -0,0 +1,63 @@
+import {
+	isBadAttribute,
+	isEmptyNonBooleanAttribute,
+	isInvalidBooleanAttribute,
+} from './attribute';
+
+export type SanitiseOptions = {
+	/**
+	 * - Sanitise boolean attributes? _(Defaults to `true`)_
+	 * - E.g. `checked="abc"` => `checked=""`
+	 */
+	sanitiseBooleanAttributes?: boolean;
+};
+
+/**
+ * - Sanitise one or more nodes _(as well as all their children)_:
+ * - Removes or sanitises bad attributes
+ */
+export function sanitise(
+	value: Node | Node[],
+	options?: Partial<SanitiseOptions>,
+): Node[] {
+	return sanitiseNodes(Array.isArray(value) ? value : [value], {
+		sanitiseBooleanAttributes: options?.sanitiseBooleanAttributes ?? true,
+	});
+}
+
+function sanitiseAttributes(
+	element: Element,
+	attributes: Attr[],
+	options: SanitiseOptions,
+): void {
+	const {length} = attributes;
+
+	for (let index = 0; index < length; index += 1) {
+		const attribute = attributes[index];
+
+		if (isBadAttribute(attribute) || isEmptyNonBooleanAttribute(attribute)) {
+			element.removeAttribute(attribute.name);
+		} else if (
+			options.sanitiseBooleanAttributes &&
+			isInvalidBooleanAttribute(attribute)
+		) {
+			element.setAttribute(attribute.name, '');
+		}
+	}
+}
+
+function sanitiseNodes(nodes: Node[], options: SanitiseOptions): Node[] {
+	const {length} = nodes;
+
+	for (let index = 0; index < length; index += 1) {
+		const node = nodes[index];
+
+		if (node instanceof Element) {
+			sanitiseAttributes(node, [...node.attributes], options);
+		}
+
+		sanitiseNodes([...node.childNodes], options);
+	}
+
+	return nodes;
+}

package/src/style.ts

@@ -36,7 +36,7 @@ export function getStyles<Property extends keyof CSSStyleDeclaration>(
 export function getTextDirection(element: Element): TextDirection {
 	const direction = element.getAttribute('dir');
 
-	if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+	if (direction != null && /^(ltr|rtl)$/i.test(direction)) {
 		return direction.toLowerCase() as TextDirection;
 	}
 

package/types/focusable.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Get a list of focusable elements within a parent element
+ */
+export declare function getFocusable(parent: Element): Element[];
+/**
+ * Get a list of tabbable elements within a parent element
+ */
+export declare function getTabbable(parent: Element): Element[];
+/**
+ * Is the element focusable?
+ */
+export declare function isFocusable(element: Element): boolean;
+/**
+ * Is the element tabbable?
+ */
+export declare function isTabbable(element: Element): boolean;

package/types/index.d.cts

@@ -121,6 +121,34 @@ export declare function findRelatives(origin: Element, selector: string, context
  * - If `skipIgnore` is `true`, no elements are ignored
  */
 export declare function getElementUnderPointer(skipIgnore?: boolean): Element | undefined;
+/**
+ * Get a list of focusable elements within a parent element
+ */
+export declare function getFocusable(parent: Element): Element[];
+/**
+ * Get a list of tabbable elements within a parent element
+ */
+export declare function getTabbable(parent: Element): Element[];
+/**
+ * Is the element focusable?
+ */
+export declare function isFocusable(element: Element): boolean;
+/**
+ * Is the element tabbable?
+ */
+export declare function isTabbable(element: Element): boolean;
+export type SanitiseOptions = {
+	/**
+	 * - Sanitise boolean attributes? _(Defaults to `true`)_
+	 * - E.g. `checked="abc"` => `checked=""`
+	 */
+	sanitiseBooleanAttributes?: boolean;
+};
+/**
+ * - Sanitise one or more nodes _(as well as all their children)_:
+ * - Removes or sanitises bad attributes
+ */
+export declare function sanitise(value: Node | Node[], options?: Partial<SanitiseOptions>): Node[];
 /**
  * Get a style from an element
  */

package/types/index.d.ts

@@ -1,5 +1,7 @@
 export * from './attribute';
 export * from './data';
 export * from './find';
+export * from './focusable';
 export * from './models';
+export * from './sanitise';
 export * from './style';

package/types/sanitise.d.ts

@@ -0,0 +1,12 @@
+export type SanitiseOptions = {
+    /**
+     * - Sanitise boolean attributes? _(Defaults to `true`)_
+     * - E.g. `checked="abc"` => `checked=""`
+     */
+    sanitiseBooleanAttributes?: boolean;
+};
+/**
+ * - Sanitise one or more nodes _(as well as all their children)_:
+ * - Removes or sanitises bad attributes
+ */
+export declare function sanitise(value: Node | Node[], options?: Partial<SanitiseOptions>): Node[];