CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-aria-query

Programmatic access to the WAI-ARIA 1.2 Roles Model specification with comprehensive role definitions, HTML element mappings, and ARIA property data.

Pending
Overview
Eval results
Files

aria-properties.mddocs/

ARIA Properties and States

Comprehensive definitions of all ARIA properties and states with type information, allowed values, and constraints. Essential for validation tools, linting, and ensuring proper ARIA usage.

Capabilities

Get Property Definition

Retrieves the complete definition for a specific ARIA property or state.

/**
 * Get complete definition for an ARIA property or state
 * @param key - ARIA property name (e.g., "aria-label", "aria-expanded")
 * @returns Property definition object or null if not found
 */
aria.get(key: string): ARIAPropertyDefinition | null;

Usage Examples:

import { aria } from "aria-query";

// Get aria-label definition
const labelDef = aria.get('aria-label');
console.log(labelDef.type); // "string"

// Get aria-expanded definition
const expandedDef = aria.get('aria-expanded');
console.log(expandedDef.type); // "boolean"
console.log(expandedDef.allowundefined); // true

// Get aria-current definition
const currentDef = aria.get('aria-current');
console.log(currentDef.type); // "token"
console.log(currentDef.values); // ["page", "step", "location", "date", "time", true, false]

// Get aria-autocomplete definition
const autocompleteDef = aria.get('aria-autocomplete');
console.log(autocompleteDef.type); // "token"  
console.log(autocompleteDef.values); // ["inline", "list", "both", "none"]

Check Property Exists

Determines if an ARIA property or state exists in the specification.

/**
 * Check if an ARIA property or state exists in the specification
 * @param key - ARIA property name to check
 * @returns True if property exists, false otherwise
 */
aria.has(key: string): boolean;

Get All Property Names

Returns an array of all available ARIA property and state names.

/**
 * Get array of all ARIA property and state names
 * @returns Array of property name strings
 */
aria.keys(): Array<string>;

Get All Property Definitions

Returns an array of all property definition objects.

/**
 * Get array of all property definition objects
 * @returns Array of ARIAPropertyDefinition objects
 */
aria.values(): Array<ARIAPropertyDefinition>;

Get All Property Entries

Returns all properties as an array of [name, definition] tuples.

/**
 * Get all properties as [name, definition] tuples
 * @returns Array of [string, ARIAPropertyDefinition] tuples
 */
aria.entries(): Array<[string, ARIAPropertyDefinition]>;

Iterate Over Properties

Executes a function for each property definition.

/**
 * Execute function for each property definition
 * @param fn - Function to execute for each property
 * @param thisArg - Optional this context for the function
 */
aria.forEach(fn: (definition: ARIAPropertyDefinition, name: string, entries: Array<[string, ARIAPropertyDefinition]>) => void, thisArg?: any): void;

Usage Examples:

import { aria } from "aria-query";

// Find all boolean properties
const booleanProps = [];
aria.forEach((definition, name) => {
  if (definition.type === 'boolean') {
    booleanProps.push(name);
  }
});

// Find properties that allow undefined
const undefinedAllowedProps = aria.keys().filter(name => {
  const def = aria.get(name);
  return def.allowundefined === true;
});

// Get all token properties with their values using entries()
const tokenProps = {};
for (const [name, definition] of aria.entries()) {
  if (definition.type === 'token' && definition.values) {
    tokenProps[name] = definition.values;
  }
}

// Same using direct iteration
const tokenProps2 = {};
for (const [name, definition] of aria) {
  if (definition.type === 'token' && definition.values) {
    tokenProps2[name] = definition.values;
  }
}

Property Types and Examples

String Properties

Properties that accept string values.

// aria-label, aria-description, aria-roledescription, etc.
const labelDef = aria.get('aria-label');
// → { type: "string" }

const descDef = aria.get('aria-description'); 
// → { type: "string" }

Boolean Properties

Properties that accept true/false values, some allowing undefined.

// aria-atomic, aria-busy, aria-disabled, etc.
const atomicDef = aria.get('aria-atomic');
// → { type: "boolean" }

const expandedDef = aria.get('aria-expanded');
// → { type: "boolean", allowundefined: true }

Token Properties

Properties that accept specific predefined values.

// aria-autocomplete
const autocompleteDef = aria.get('aria-autocomplete');
// → { type: "token", values: ["inline", "list", "both", "none"] }

// aria-live
const liveDef = aria.get('aria-live');
// → { type: "token", values: ["assertive", "off", "polite"] }

// aria-sort
const sortDef = aria.get('aria-sort');
// → { type: "token", values: ["ascending", "descending", "none", "other"] }

ID and ID List Properties

Properties that reference element IDs.

// aria-labelledby, aria-describedby (ID lists)
const labelledbyDef = aria.get('aria-labelledby');
// → { type: "idlist" }

// aria-activedescendant, aria-details (single IDs)
const activeDescDef = aria.get('aria-activedescendant');
// → { type: "id" }

Numeric Properties

Properties that accept integer or number values.

// aria-level, aria-colcount, aria-rowcount (integers)
const levelDef = aria.get('aria-level');
// → { type: "integer" }

// aria-valuemin, aria-valuemax, aria-valuenow (numbers)
const valueminDef = aria.get('aria-valuemin');
// → { type: "number" }

Tristate Properties

Properties that accept true, false, or "mixed".

// aria-checked, aria-pressed
const checkedDef = aria.get('aria-checked');
// → { type: "tristate" }

Token List Properties

Properties that accept multiple space-separated tokens.

// aria-dropeffect
const dropeffectDef = aria.get('aria-dropeffect');
// → { type: "tokenlist", values: ["copy", "execute", "link", "move", "none", "popup"] }

// aria-relevant  
const relevantDef = aria.get('aria-relevant');
// → { type: "tokenlist", values: ["additions", "all", "removals", "text"] }

Property Categories

Global Properties

Properties that can be used on any element:

const globalProperties = [
  'aria-atomic', 'aria-busy', 'aria-controls', 'aria-current',
  'aria-describedby', 'aria-details', 'aria-disabled', 'aria-dropeffect',
  'aria-errormessage', 'aria-flowto', 'aria-grabbed', 'aria-haspopup',
  'aria-hidden', 'aria-invalid', 'aria-keyshortcuts', 'aria-label',
  'aria-labelledby', 'aria-live', 'aria-owns', 'aria-relevant',
  'aria-roledescription'
];

Widget Properties

Properties specific to interactive widgets:

const widgetProperties = [
  'aria-autocomplete', 'aria-checked', 'aria-expanded', 'aria-haspopup',
  'aria-level', 'aria-multiline', 'aria-multiselectable', 'aria-orientation',
  'aria-placeholder', 'aria-pressed', 'aria-readonly', 'aria-required',
  'aria-selected', 'aria-sort', 'aria-valuemax', 'aria-valuemin',
  'aria-valuenow', 'aria-valuetext'
];

Types

// ARIA property definition structure
interface ARIAPropertyDefinition {
  /** Data type of the property */
  type: 'string' | 'id' | 'idlist' | 'integer' | 'number' | 'boolean' | 'token' | 'tokenlist' | 'tristate';
  /** Allowed values for token and tokenlist types */
  values?: Array<string | boolean>;
  /** Whether undefined is explicitly allowed (for some boolean properties) */
  allowundefined?: boolean;
}

// Type aliases for collections
type ARIAPropertyDefinitionTuple = [string, ARIAPropertyDefinition];
type ARIAPropertyDefinitions = Array<ARIAPropertyDefinitionTuple>;

// Union type of all ARIA property names
type ARIAProperty = 
  'aria-activedescendant' | 'aria-atomic' | 'aria-autocomplete' | 'aria-braillelabel' |
  'aria-brailleroledescription' | 'aria-busy' | 'aria-checked' | 'aria-colcount' |
  'aria-colindex' | 'aria-colspan' | 'aria-controls' | 'aria-current' |
  'aria-describedby' | 'aria-description' | 'aria-details' | 'aria-disabled' |
  'aria-dropeffect' | 'aria-errormessage' | 'aria-expanded' | 'aria-flowto' |
  'aria-grabbed' | 'aria-haspopup' | 'aria-hidden' | 'aria-invalid' |
  'aria-keyshortcuts' | 'aria-label' | 'aria-labelledby' | 'aria-level' |
  'aria-live' | 'aria-modal' | 'aria-multiline' | 'aria-multiselectable' |
  'aria-orientation' | 'aria-owns' | 'aria-placeholder' | 'aria-posinset' |
  'aria-pressed' | 'aria-readonly' | 'aria-relevant' | 'aria-required' |
  'aria-roledescription' | 'aria-rowcount' | 'aria-rowindex' | 'aria-rowspan' |
  'aria-selected' | 'aria-setsize' | 'aria-sort' | 'aria-valuemax' |
  'aria-valuemin' | 'aria-valuenow' | 'aria-valuetext';

Install with Tessl CLI

npx tessl i tessl/npm-aria-query

docs

aria-properties.md

dom-elements.md

element-role-mappings.md

index.md

role-definitions.md

role-element-mappings.md

tile.json