@oscarpalmer/toretto 0.45.0 → 0.47.0

package/dist/internal/attribute.mjs

@@ -1,5 +1,5 @@
-import { updateElementValue } from "./element-value.mjs";
 import { updateProperty } from "./property.mjs";
+import { updateElementValue } from "./element-value.mjs";
 import { isPlainObject } from "@oscarpalmer/atoms/is";
 import { getString } from "@oscarpalmer/atoms/string";
 import { kebabCase } from "@oscarpalmer/atoms/string/case";
@@ -96,7 +96,7 @@ const booleanAttributes = Object.freeze([
 	"selected"
 ]);
 const booleanAttributesSet = new Set(booleanAttributes);
-const dispatchedAttributes = new Set([
+const dispatchedAttributes = /* @__PURE__ */ new Set([
 	"checked",
 	"open",
 	"value"

package/dist/internal/element-value.mjs

@@ -1,5 +1,3 @@
-import { isHTMLOrSVGElement } from "./is.mjs";
-import "../is.mjs";
 import { isAttribute } from "./attribute.mjs";
 import { isNullableOrWhitespace } from "@oscarpalmer/atoms/is";
 import { getString } from "@oscarpalmer/atoms/string";
@@ -13,12 +11,12 @@ function normalizeKey(key, style) {
 	return style && key.startsWith(CSS_VARIABLE_PREFIX) ? key : kebabCase(key);
 }
 function setElementValue(element, first, second, third, callback, style) {
-	if (!isHTMLOrSVGElement(element)) return;
+	if (!(element instanceof Element)) return;
 	if (typeof first === "string") setElementValues(element, first, second, third, callback, style);
 	else if (isAttribute(first)) setElementValues(element, first.name, first.value, third, callback, style);
 }
 function setElementValues(element, first, second, third, callback, style) {
-	if (!isHTMLOrSVGElement(element)) return;
+	if (!(element instanceof Element)) return;
 	const dispatch = third !== false;
 	if (typeof first === "string") {
 		callback(element, normalizeKey(first, style), second, dispatch);

package/dist/internal/is.d.mts

@@ -1,21 +1,33 @@
+import { EventPosition } from "@oscarpalmer/atoms/models";
+
 //#region src/internal/is.d.ts
+/**
+ * Is the value an event position?
+ *
+ * @param value Value to check
+ * @returns `true` if it's an event position, otherwise `false`
+ */
+declare function isEventPosition(value: unknown): value is EventPosition;
 /**
  * Is the value an event target?
+ *
  * @param value Value to check
  * @returns `true` if it's an event target, otherwise `false`
  */
 declare function isEventTarget(value: unknown): value is EventTarget;
 /**
- * Is the value an HTML or SVG element?
+ * Is the value an _HTML_ or _SVG_ element?
+ *
  * @param value Value to check
- * @returns `true` if it's an HTML or SVG element, otherwise `false`
+ * @returns `true` if it's an _HTML_ or _SVG_ element, otherwise `false`
  */
 declare function isHTMLOrSVGElement(value: unknown): value is HTMLElement | SVGElement;
 /**
  * Is the value an input element? _(`<input>`, `<select>`, or `<textarea>`)_
+ *
  * @param value Value to check
  * @returns `true` if it's an input element, otherwise `false`
  */
 declare function isInputElement(value: unknown): value is HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
 //#endregion
-export { isEventTarget, isHTMLOrSVGElement, isInputElement };
+export { isEventPosition, isEventTarget, isHTMLOrSVGElement, isInputElement };

package/dist/internal/is.mjs

@@ -1,6 +1,16 @@
 //#region src/internal/is.ts
 /**
+* Is the value an event position?
+*
+* @param value Value to check
+* @returns `true` if it's an event position, otherwise `false`
+*/
+function isEventPosition(value) {
+	return typeof value === "object" && value != null && typeof value.x === "number" && typeof value.y === "number";
+}
+/**
 * Is the value an event target?
+*
 * @param value Value to check
 * @returns `true` if it's an event target, otherwise `false`
 */
@@ -8,15 +18,17 @@ function isEventTarget(value) {
 	return typeof value === "object" && value != null && typeof value.addEventListener === "function" && typeof value.removeEventListener === "function" && typeof value.dispatchEvent === "function";
 }
 /**
-* Is the value an HTML or SVG element?
+* Is the value an _HTML_ or _SVG_ element?
+*
 * @param value Value to check
-* @returns `true` if it's an HTML or SVG element, otherwise `false`
+* @returns `true` if it's an _HTML_ or _SVG_ element, otherwise `false`
 */
 function isHTMLOrSVGElement(value) {
 	return value instanceof HTMLElement || value instanceof SVGElement;
 }
 /**
 * Is the value an input element? _(`<input>`, `<select>`, or `<textarea>`)_
+*
 * @param value Value to check
 * @returns `true` if it's an input element, otherwise `false`
 */
@@ -24,4 +36,4 @@ function isInputElement(value) {
 	return value instanceof HTMLInputElement || value instanceof HTMLSelectElement || value instanceof HTMLTextAreaElement;
 }
 //#endregion
-export { isEventTarget, isHTMLOrSVGElement, isInputElement };
+export { isEventPosition, isEventTarget, isHTMLOrSVGElement, isInputElement };

package/dist/is.d.mts

@@ -1,24 +1,27 @@
-import { isEventTarget, isHTMLOrSVGElement, isInputElement } from "./internal/is.mjs";
+import { isEventPosition, isEventTarget, isHTMLOrSVGElement, isInputElement } from "./internal/is.mjs";
 
 //#region src/is.d.ts
 /**
  * Is the value a child node?
+ *
  * @param value Value to check
  * @returns `true` if it's a child node, otherwise `false`
  */
 declare function isChildNode(value: unknown): value is ChildNode;
 /**
  * Is the node inside a document?
+ *
  * @param node Node to check
  * @returns `true` if it's inside a document, otherwise `false`
  */
 declare function isInDocument(node: Node): boolean;
 /**
  * Is the node inside a specific document?
+ *
  * @param node Node to check
  * @param document Document to check within
  * @returns `true` if it's inside the document, otherwise `false`
  */
 declare function isInDocument(node: Node, document: Document): boolean;
 //#endregion
-export { isChildNode, isEventTarget, isHTMLOrSVGElement, isInDocument, isInputElement };
+export { isChildNode, isEventPosition, isEventTarget, isHTMLOrSVGElement, isInDocument, isInputElement };

package/dist/is.mjs

@@ -1,7 +1,8 @@
-import { isEventTarget, isHTMLOrSVGElement, isInputElement } from "./internal/is.mjs";
+import { isEventPosition, isEventTarget, isHTMLOrSVGElement, isInputElement } from "./internal/is.mjs";
 //#region src/is.ts
 /**
 * Is the value a child node?
+*
 * @param value Value to check
 * @returns `true` if it's a child node, otherwise `false`
 */
@@ -13,7 +14,7 @@ function isInDocument(node, doc) {
 	if (!(doc instanceof Document)) return node.ownerDocument?.contains(node) ?? true;
 	return node.ownerDocument == null ? node === doc : node.ownerDocument === doc && doc.contains(node);
 }
-const CHILD_NODE_TYPES = new Set([
+const CHILD_NODE_TYPES = /* @__PURE__ */ new Set([
 	Node.ELEMENT_NODE,
 	Node.TEXT_NODE,
 	Node.PROCESSING_INSTRUCTION_NODE,
@@ -21,4 +22,4 @@ const CHILD_NODE_TYPES = new Set([
 	Node.DOCUMENT_TYPE_NODE
 ]);
 //#endregion
-export { isChildNode, isEventTarget, isHTMLOrSVGElement, isInDocument, isInputElement };
+export { isChildNode, isEventPosition, isEventTarget, isHTMLOrSVGElement, isInDocument, isInputElement };

package/dist/models.d.mts

@@ -1,4 +1,24 @@
 //#region src/models.d.ts
+/**
+ * _ARIA_ attribute for an element
+ *
+ * _(https://www.w3.org/TR/wai-aria-1.3/#aria-attributes)_
+ */
+type AriaAttribute = keyof AriaAttributes;
+/**
+ * _ARIA_ attribute for an element without the `aria-` prefix
+ *
+ * _(https://www.w3.org/TR/wai-aria-1.3/#aria-attributes)_
+ */
+type AriaAttributeUnprefixed = keyof { [Key in AriaAttribute as Key extends `aria-${infer Name}` ? Name : never]: string | null };
+type AriaAttributes = { [Key in keyof ARIAMixin as NormalizedName<Key>]: string | null };
+type NormalizedName<Key extends string> = Key extends `aria${infer Name}` ? Name extends `${infer Part}Element` ? `aria-${Lowercase<Part>}` : Name extends `${infer Part}Elements` ? `aria-${Lowercase<Part>}` : `aria-${Lowercase<Name>}` : never;
+/**
+ * _ARIA_ role for an element
+ *
+ * _(https://www.w3.org/TR/wai-aria-1.3/#role_definitions)_
+ */
+type AriaRole = 'alert' | 'alertdialog' | 'application' | 'article' | 'banner' | 'blockquote' | 'button' | 'caption' | 'cell' | 'checkbox' | 'code' | 'columnheader' | 'combobox' | 'comment' | 'complementary' | 'contentinfo' | 'definition' | 'deletion' | 'dialog' | 'directory' | 'document' | 'emphasis' | 'feed' | 'figure' | 'form' | 'generic' | 'grid' | 'gridcell' | 'group' | 'heading' | 'img' | 'insertion' | 'link' | 'list' | 'listbox' | 'listitem' | 'log' | 'main' | 'mark' | 'marquee' | 'math' | 'menu' | 'menubar' | 'menuitem' | 'menuitemcheckbox' | 'menuitemradio' | 'meter' | 'navigation' | 'none' | 'note' | 'option' | 'paragraph' | 'presentation' | 'progressbar' | 'radio' | 'radiogroup' | 'region' | 'row' | 'rowgroup' | 'rowheader' | 'scrollbar' | 'search' | 'searchbox' | 'sectionfooter' | 'sectionheader' | 'separator' | 'slider' | 'spinbutton' | 'status' | 'strong' | 'subscript' | 'suggestion' | 'superscript' | 'switch' | 'tab' | 'table' | 'tablist' | 'tabpanel' | 'term' | 'textbox' | 'time' | 'timer' | 'toolbar' | 'tooltip' | 'tree' | 'treegrid' | 'treeitem';
 /**
  * Attribute for an element
  */
@@ -10,13 +30,6 @@ type Attribute = {
  * Event listener for custom events
  */
 type CustomEventListener = (event: CustomEvent) => void;
-/**
- * The position of an event
- */
-type EventPosition = {
-  x: number;
-  y: number;
-};
 /**
  * Event listener that can be removed
  */
@@ -30,4 +43,4 @@ type Selector = string | Node | Node[] | NodeList;
  */
 type TextDirection = 'ltr' | 'rtl';
 //#endregion
-export { Attribute, CustomEventListener, EventPosition, RemovableEventListener, Selector, TextDirection };
+export { AriaAttribute, AriaAttributeUnprefixed, AriaRole, Attribute, CustomEventListener, RemovableEventListener, Selector, TextDirection };

package/dist/property/get.property.d.mts

@@ -4,6 +4,7 @@ import { Primitive } from "@oscarpalmer/atoms/models";
 type GetProperties<Target extends Element> = { [Property in keyof Target as Target[Property] extends Primitive ? Property : never]?: Target[Property] };
 /**
  * Get the values of one or more properties on an element
+ *
  * @param target Target element
  * @param properties Properties to get
  * @returns Property values
@@ -11,6 +12,7 @@ type GetProperties<Target extends Element> = { [Property in keyof Target as Targ
 declare function getProperties<Target extends Element, Property extends keyof GetProperties<Target>>(target: Target, properties: Property[]): Pick<GetProperties<Target>, Property>;
 /**
  * Get the value of a property on an element
+ *
  * @param target Target element
  * @param property Property to get
  * @returns Property value

package/dist/property/get.property.mjs

@@ -1,15 +1,15 @@
-import { isHTMLOrSVGElement } from "../internal/is.mjs";
 import { camelCase } from "@oscarpalmer/atoms/string/case";
 //#region src/property/get.property.ts
 /**
 * Get the values of one or more properties on an element
+*
 * @param target Target element
 * @param properties Properties to get
 * @returns Property values
 */
 function getProperties(target, properties) {
 	const values = {};
-	if (!isHTMLOrSVGElement(target) || !Array.isArray(properties)) return values;
+	if (!(target instanceof Element && Array.isArray(properties))) return values;
 	const { length } = properties;
 	for (let index = 0; index < length; index += 1) {
 		const property = properties[index];
@@ -19,12 +19,13 @@ function getProperties(target, properties) {
 }
 /**
 * Get the value of a property on an element
+*
 * @param target Target element
 * @param property Property to get
 * @returns Property value
 */
 function getProperty(target, property) {
-	if (isHTMLOrSVGElement(target) && typeof property === "string") return getPropertyValue(target, property);
+	if (target instanceof Element && typeof property === "string") return getPropertyValue(target, property);
 }
 function getPropertyValue(element, property) {
 	let actual = property;

package/dist/property/set.property.d.mts

@@ -8,6 +8,7 @@ type SetProperties<Target extends Element> = { [Property in keyof Target as Targ
  * Set the values of one or more properties on an element
  *
  * Also updates attributes for boolean/dispatchable properties, and if `dispatch` is `true`, will dispatch events for dispatchable properties
+ *
  * @param target Target element
  * @param properties Properties to set
  * @param dispatch Dispatch events for properties? _(defaults to `true`)_
@@ -15,6 +16,7 @@ type SetProperties<Target extends Element> = { [Property in keyof Target as Targ
 declare function setProperties<Target extends Element>(target: Target, properties: SetProperties<Target>, dispatch?: boolean): void;
 /**
  * Set the value for a dispatchable property on an element
+ *
  * @param target Target element
  * @param property Property to set
  * @param value Value to set
@@ -23,6 +25,7 @@ declare function setProperties<Target extends Element>(target: Target, propertie
 declare function setProperty<Target extends Element, Property extends DispatchedAttributeName>(target: Target, property: Property, value: DispatchedPropertyValue<Target, Property>, dispatch?: boolean): void;
 /**
  * Set the value for a property on an element
+ *
  * @param target Target element
  * @param property Property to set
  * @param value Value to set

package/dist/property/set.property.mjs

@@ -1,5 +1,3 @@
-import { isHTMLOrSVGElement } from "../internal/is.mjs";
-import "../is.mjs";
 import { updateProperty } from "../internal/property.mjs";
 import { booleanAttributesSet, dispatchedAttributes } from "../internal/attribute.mjs";
 import { setAttribute } from "../attribute/set.attribute.mjs";
@@ -10,19 +8,20 @@ import { isPlainObject } from "@oscarpalmer/atoms/is";
 * Set the values of one or more properties on an element
 *
 * Also updates attributes for boolean/dispatchable properties, and if `dispatch` is `true`, will dispatch events for dispatchable properties
+*
 * @param target Target element
 * @param properties Properties to set
 * @param dispatch Dispatch events for properties? _(defaults to `true`)_
 */
 function setProperties(target, properties, dispatch) {
-	if (!isHTMLOrSVGElement(target) || !isPlainObject(properties)) return;
+	if (!(target instanceof Element) || !isPlainObject(properties)) return;
 	const shouldDispatch = dispatch !== false;
 	const keys = Object.keys(properties);
 	const { length } = keys;
 	for (let index = 0; index < length; index += 1) setPropertyValue(target, keys[index], properties[keys[index]], shouldDispatch);
 }
 function setProperty(target, property, value, dispatch) {
-	if (isHTMLOrSVGElement(target) && typeof property === "string") setPropertyValue(target, property, value, dispatch !== false);
+	if (target instanceof Element && typeof property === "string") setPropertyValue(target, property, value, dispatch !== false);
 }
 function setPropertyValue(element, property, value, dispatch) {
 	if (booleanAttributesSet.has(property.toLowerCase()) || dispatchedAttributes.has(property)) setAttribute(element, property, value, dispatch);

package/dist/style.d.mts

@@ -16,6 +16,7 @@ type Styles = Partial<Record<keyof CSSStyleValues, unknown>>;
 type Variables<Value extends Record<string, string | undefined> = Record<string, string | undefined>> = { [property in keyof Value as `--${string & property}`]?: string | undefined };
 /**
  * Get a style from an element
+ *
  * @param element Element to get the style from
  * @param property Style name
  * @param computed Get the computed style? _(defaults to `false`)_
@@ -24,6 +25,7 @@ type Variables<Value extends Record<string, string | undefined> = Record<string,
 declare function getStyle(element: Element, property: keyof CSSStyleValues, computed?: boolean): string | undefined;
 /**
  * Get styles from an element
+ *
  * @param element Element to get the styles from
  * @param properties Styles to get
  * @param computed Get the computed styles? _(defaults to `false`)_
@@ -32,17 +34,20 @@ declare function getStyle(element: Element, property: keyof CSSStyleValues, comp
 declare function getStyles<Property extends keyof CSSStyleValues>(element: Element, properties: Property[], computed?: boolean): Record<Property, string | undefined>;
 /**
  * Get the text direction of a node or element _(or document, if element is invalid)_
+ *
  * @param node Node or element to get the text direction from
  * @returns Text direction
  */
 declare function getTextDirection(node: Element | Node): TextDirection;
 /**
  * Get the text direction of the document
+ *
  * @returns Text direction
  */
 declare function getTextDirection(): TextDirection;
 /**
  * Set a style on an element
+ *
  * @param element Element to set the style on
  * @param property Style name
  * @param value Style value
@@ -50,12 +55,14 @@ declare function getTextDirection(): TextDirection;
 declare function setStyle(element: Element, property: keyof CSSStyleValues, value?: unknown): void;
 /**
  * Set styles on an element
+ *
  * @param element Element to set the styles on
  * @param styles Styles to set
  */
 declare function setStyles(element: Element, styles: Styles): void;
 /**
  * Toggle styles for an element
+ *
  * @param element Element to style
  * @param styles Styles to be set or removed
  * @returns Style toggler

package/dist/style.mjs

@@ -1,20 +1,21 @@
-import { isHTMLOrSVGElement } from "./internal/is.mjs";
 import { setElementValues, updateElementValue } from "./internal/element-value.mjs";
 import { getStyleValue } from "./internal/get-value.mjs";
 import { getString } from "@oscarpalmer/atoms/string";
 //#region src/style.ts
 /**
 * Get a style from an element
+*
 * @param element Element to get the style from
 * @param property Style name
 * @param computed Get the computed style? _(defaults to `false`)_
 * @returns Style value
 */
 function getStyle(element, property, computed) {
-	if (isHTMLOrSVGElement(element) && typeof property === "string") return getStyleValue(element, property, computed === true);
+	if (element instanceof Element && typeof property === "string") return getStyleValue(element, property, computed === true);
 }
 /**
 * Get styles from an element
+*
 * @param element Element to get the styles from
 * @param properties Styles to get
 * @param computed Get the computed styles? _(defaults to `false`)_
@@ -22,7 +23,7 @@ function getStyle(element, property, computed) {
 */
 function getStyles(element, properties, computed) {
 	const styles = {};
-	if (!(isHTMLOrSVGElement(element) && Array.isArray(properties))) return styles;
+	if (!(element instanceof Element && Array.isArray(properties))) return styles;
 	const { length } = properties;
 	for (let index = 0; index < length; index += 1) {
 		const property = properties[index];
@@ -32,7 +33,7 @@ function getStyles(element, properties, computed) {
 }
 function getTextDirection(node) {
 	let target;
-	if (isHTMLOrSVGElement(node)) target = node;
+	if (node instanceof Element) target = node;
 	else target = node instanceof Node ? node.ownerDocument?.documentElement ?? document.documentElement : document.documentElement;
 	let { direction } = target.style;
 	if (direction === "") direction = getStyleValue(target, PROPERTY_DIRECTION, true);
@@ -40,6 +41,7 @@ function getTextDirection(node) {
 }
 /**
 * Set a style on an element
+*
 * @param element Element to set the style on
 * @param property Style name
 * @param value Style value
@@ -49,6 +51,7 @@ function setStyle(element, property, value) {
 }
 /**
 * Set styles on an element
+*
 * @param element Element to set the styles on
 * @param styles Styles to set
 */
@@ -57,6 +60,7 @@ function setStyles(element, styles) {
 }
 /**
 * Toggle styles for an element
+*
 * @param element Element to style
 * @param styles Styles to be set or removed
 * @returns Style toggler

package/dist/touch.d.mts

@@ -6,10 +6,14 @@ type SupporsTouch = {
   readonly value: boolean;
   /**
    * Are touch events supported?
+   *
+   * @returns `true` if touch events are supported, otherwise `false`
    */
   get(): boolean;
   /**
    * Re-evaluate if touch events are supported
+   *
+   * @returns `true` if touch events are supported, otherwise `false`
    */
   update(): boolean;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@oscarpalmer/toretto",
-	"version": "0.45.0",
+	"version": "0.47.0",
 	"description": "A collection of badass DOM utilities.",
 	"keywords": [
 		"dom",
@@ -30,6 +30,10 @@
 			"types": "./dist/index.d.mts",
 			"default": "./dist/index.mjs"
 		},
+		"./aria": {
+			"types": "./dist/aria.d.mts",
+			"default": "./dist/aria.mjs"
+		},
 		"./attribute": {
 			"types": "./dist/attribute/index.d.mts",
 			"default": "./dist/attribute/index.mjs"
@@ -86,15 +90,15 @@
 		"test:leak": "npx vp test run --detect-async-leaks --coverage"
 	},
 	"dependencies": {
-		"@oscarpalmer/atoms": "^0.185"
+		"@oscarpalmer/atoms": "^0.188.1"
 	},
 	"devDependencies": {
-		"@oxlint/plugins": "^1.62",
-		"@types/node": "^25.6",
+		"@oxlint/plugins": "^1.73",
+		"@types/node": "^26.1",
 		"@vitest/coverage-istanbul": "^4.1",
 		"jsdom": "^29.1",
-		"tsdown": "^0.21",
-		"typescript": "^5.9",
+		"tsdown": "^0.22",
+		"typescript": "^6",
 		"vite": "npm:@voidzero-dev/vite-plus-core@latest",
 		"vite-plus": "latest",
 		"vitest": "npm:@voidzero-dev/vite-plus-test@latest"

package/src/aria.ts

@@ -0,0 +1,166 @@
+import {setElementValues, updateElementValue} from './internal/element-value';
+import type {AriaAttribute, AriaAttributeUnprefixed, AriaRole} from './models';
+
+// #region Types
+
+type AnyAriaAttribute = AriaAttribute | AriaAttributeUnprefixed;
+
+type AriaAttributeItem = {
+	name: AnyAriaAttribute;
+	value?: string;
+};
+
+// #endregion
+
+// #region Functions
+
+/**
+ * Get the value of a specific _ARIA_ attribute from an element
+ *
+ * @param element Element to get _ARIA_ attribute from
+ * @param name _ARIA_ name
+ * @returns _ARIA_ value _(or `undefined`)_
+ */
+export function getAria(element: Element, attribute: AnyAriaAttribute): string | undefined;
+
+/**
+ * Get specific _ARIA_ attributes from an element
+ *
+ * @param element Element to get _ARIA_ attributes from
+ * @param names _ARIA_ attribute names
+ * @returns Object of named _ARIA_ attributes
+ */
+export function getAria<Attribute extends AnyAriaAttribute>(
+	element: Element,
+	attributes: Attribute[],
+): Record<Attribute, string | undefined>;
+
+export function getAria(element: Element, value: string | string[]): unknown {
+	if (!(element instanceof Element)) {
+		return Array.isArray(value) ? {} : undefined;
+	}
+
+	if (!Array.isArray(value)) {
+		return typeof value === 'string' ? getAriaValue(element, value) : undefined;
+	}
+
+	const arias = {} as Record<string, string | undefined>;
+
+	const {length} = value;
+
+	for (let index = 0; index < length; index += 1) {
+		const attribute = value[index];
+
+		if (typeof attribute === 'string') {
+			arias[attribute.replace(ATTRIBUTE_ARIA_PREFIX, '')] = getAriaValue(element, attribute);
+		}
+	}
+
+	return arias;
+}
+
+function getAriaValue(element: Element, attribute: string): string | undefined {
+	return element.getAttribute(getName(attribute)) ?? undefined;
+}
+
+function getName(value: string): string {
+	return EXPRESSION_ARIA_PREFIX.test(value) ? value : `${ATTRIBUTE_ARIA_PREFIX}${value}`;
+}
+
+/**
+ * Get the role of an element
+ *
+ * @param element Element to get role from
+ * @returns Element role _(or `undefined`)_
+ */
+export function getRole(element: Element): unknown {
+	if (element instanceof Element) {
+		return element.getAttribute('role') ?? undefined;
+	}
+}
+
+/**
+ * Set an _ARIA_ attribute on an element
+ *
+ * _(Or remove it, if value is `null` or `undefined`)_
+ *
+ * @param element Element for _ARIA_ attribute
+ * @param attribute _ARIA_ attribute to set
+ * @param value _ARIA_ attribute value
+ */
+export function setAria(element: Element, attribute: AnyAriaAttribute, value?: string): void;
+
+/**
+ * Set one or more _ARIA_ attributes on an element
+ *
+ * _(Or remove them, if their value is `null` or `undefined`)_
+ *
+ * @param element Element for _ARIA_ attributes
+ * @param attributes _ARIA_ attributes to set
+ */
+export function setAria(element: Element, attributes: AriaAttributeItem[]): void;
+
+/**
+ * Set one or more _ARIA_ attributes on an element
+ *
+ * _(Or remove them, if their value is `null` or `undefined`)_
+ *
+ * @param element Element for _ARIA_ attributes
+ * @param attributes _ARIA_ attributes to set
+ */
+export function setAria(
+	element: Element,
+	attributes: Partial<Record<AnyAriaAttribute, unknown>>,
+): void;
+
+export function setAria(
+	element: Element,
+	first: AnyAriaAttribute | AriaAttributeItem[] | Partial<Record<AnyAriaAttribute, unknown>>,
+	second?: unknown,
+): void {
+	setElementValues(element, first, second, null, updateAriaAttribute);
+}
+
+/**
+ * Set the role of an element
+ *
+ * @param element Element for role
+ * @param role Role to set _(or `undefined` to remove it)_
+ */
+export function setRole(element: Element, role?: AriaRole): void {
+	if (!(element instanceof Element)) {
+		return;
+	}
+
+	if (typeof role === 'string') {
+		element.setAttribute('role', role);
+	} else {
+		element.removeAttribute('role');
+	}
+}
+
+function updateAriaAttribute(element: Element, key: string, value: unknown): void {
+	updateElementValue(
+		element,
+		getName(key),
+		value,
+		// Using `.call` in `updateElementValue`
+		// oxlint-disable-next-line typescript/unbound-method
+		element.setAttribute,
+		// Using `.call` in `updateElementValue`
+		// oxlint-disable-next-line typescript/unbound-method
+		element.removeAttribute,
+		false,
+		false,
+	);
+}
+
+// #endregion
+
+// #region Variables
+
+const ATTRIBUTE_ARIA_PREFIX = 'aria-';
+
+const EXPRESSION_ARIA_PREFIX = /^aria-/i;
+
+// #endregion