@octanejs/aria 0.0.4 → 0.0.6

package/src/intl/tree/index.ts

@@ -0,0 +1,82 @@
+// Generated locale-dictionary index for the tree area — the octane equivalent of
+// upstream's Parcel glob import (`import intlMessages from '../../intl/tree/*.json'`).
+// The JSON files are copied VERBATIM from .react-spectrum/packages/react-aria/intl/tree/;
+// refresh them from the pinned checkout on version bumps, never hand-edit.
+//
+// Upstream's Parcel build additionally compiles each message through
+// @internationalized/string-compiler, so `{variable}` placeholders and plural/select
+// ICU arguments become message FUNCTIONS (LocalizedStringFormatter interpolates only
+// function messages — plain strings are returned verbatim). `compileDictionaries`
+// applies the equivalent compile step here at module init.
+import { compileDictionaries } from '../compileMessages';
+import ar_AE from './ar-AE.json';
+import bg_BG from './bg-BG.json';
+import cs_CZ from './cs-CZ.json';
+import da_DK from './da-DK.json';
+import de_DE from './de-DE.json';
+import el_GR from './el-GR.json';
+import en_US from './en-US.json';
+import es_ES from './es-ES.json';
+import et_EE from './et-EE.json';
+import fi_FI from './fi-FI.json';
+import fr_FR from './fr-FR.json';
+import he_IL from './he-IL.json';
+import hr_HR from './hr-HR.json';
+import hu_HU from './hu-HU.json';
+import it_IT from './it-IT.json';
+import ja_JP from './ja-JP.json';
+import ko_KR from './ko-KR.json';
+import lt_LT from './lt-LT.json';
+import lv_LV from './lv-LV.json';
+import nb_NO from './nb-NO.json';
+import nl_NL from './nl-NL.json';
+import pl_PL from './pl-PL.json';
+import pt_BR from './pt-BR.json';
+import pt_PT from './pt-PT.json';
+import ro_RO from './ro-RO.json';
+import ru_RU from './ru-RU.json';
+import sk_SK from './sk-SK.json';
+import sl_SI from './sl-SI.json';
+import sr_SP from './sr-SP.json';
+import sv_SE from './sv-SE.json';
+import tr_TR from './tr-TR.json';
+import uk_UA from './uk-UA.json';
+import zh_CN from './zh-CN.json';
+import zh_TW from './zh-TW.json';
+
+export default compileDictionaries({
+	'ar-AE': ar_AE,
+	'bg-BG': bg_BG,
+	'cs-CZ': cs_CZ,
+	'da-DK': da_DK,
+	'de-DE': de_DE,
+	'el-GR': el_GR,
+	'en-US': en_US,
+	'es-ES': es_ES,
+	'et-EE': et_EE,
+	'fi-FI': fi_FI,
+	'fr-FR': fr_FR,
+	'he-IL': he_IL,
+	'hr-HR': hr_HR,
+	'hu-HU': hu_HU,
+	'it-IT': it_IT,
+	'ja-JP': ja_JP,
+	'ko-KR': ko_KR,
+	'lt-LT': lt_LT,
+	'lv-LV': lv_LV,
+	'nb-NO': nb_NO,
+	'nl-NL': nl_NL,
+	'pl-PL': pl_PL,
+	'pt-BR': pt_BR,
+	'pt-PT': pt_PT,
+	'ro-RO': ro_RO,
+	'ru-RU': ru_RU,
+	'sk-SK': sk_SK,
+	'sl-SI': sl_SI,
+	'sr-SP': sr_SP,
+	'sv-SE': sv_SE,
+	'tr-TR': tr_TR,
+	'uk-UA': uk_UA,
+	'zh-CN': zh_CN,
+	'zh-TW': zh_TW,
+});

package/src/intl/tree/it-IT.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Comprimi",
+  "expand": "Espandi"
+}

package/src/intl/tree/ja-JP.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "折りたたむ",
+  "expand": "展開"
+}

package/src/intl/tree/ko-KR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "접기",
+  "expand": "펼치기"
+}

package/src/intl/tree/lt-LT.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Sutraukti",
+  "expand": "Išskleisti"
+}

package/src/intl/tree/lv-LV.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Sakļaut",
+  "expand": "Izvērst"
+}

package/src/intl/tree/nb-NO.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Skjul",
+  "expand": "Utvid"
+}

package/src/intl/tree/nl-NL.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Samenvouwen",
+  "expand": "Uitvouwen"
+}

package/src/intl/tree/pl-PL.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Zwiń",
+  "expand": "Rozwiń"
+}

package/src/intl/tree/pt-BR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Recolher",
+  "expand": "Expandir"
+}

package/src/intl/tree/pt-PT.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Colapsar",
+  "expand": "Expandir"
+}

package/src/intl/tree/ro-RO.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Restrângeți",
+  "expand": "Extindeți"
+}

package/src/intl/tree/ru-RU.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Свернуть",
+  "expand": "Развернуть"
+}

package/src/intl/tree/sk-SK.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Zbaliť",
+  "expand": "Rozbaliť"
+}

package/src/intl/tree/sl-SI.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Strni",
+  "expand": "Razširi"
+}

package/src/intl/tree/sr-SP.json

@@ -0,0 +1,4 @@
+{
+  "collapse": " Skupi",
+  "expand": "Proširi"
+}

package/src/intl/tree/sv-SE.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Dölj",
+  "expand": "Expandera"
+}

package/src/intl/tree/tr-TR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Daralt",
+  "expand": "Genişlet"
+}

package/src/intl/tree/uk-UA.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Згорнути",
+  "expand": "Розгорнути"
+}

package/src/intl/tree/zh-CN.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "折叠",
+  "expand": "扩展"
+}

package/src/intl/tree/zh-TW.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "收合",
+  "expand": "展開"
+}

package/src/stately/autocomplete/useAutocompleteState.ts

@@ -0,0 +1,85 @@
+// Ported from react-stately (source: .react-spectrum/packages/react-stately/src/autocomplete/useAutocompleteState.ts).
+// octane adaptations: public-hook slot threading (splitSlot/subSlot) per the binding
+// convention; `ReactNode` → a structural `any` alias (octane renderables); the public
+// value-level `onInputChange(value)` callback is unchanged (the onInput rule applies
+// only to DOM wiring, which lives in useTextField/useAutocomplete).
+import { useState } from 'octane';
+
+import { S, splitSlot, subSlot } from '../../internal';
+import { useControlledState } from '../utils/useControlledState';
+
+// octane adaptation: structural alias for React's ReactNode.
+type ReactNode = any;
+
+export interface AutocompleteState {
+	/** The current value of the autocomplete input. */
+	inputValue: string;
+	/** Sets the value of the autocomplete input. */
+	setInputValue(value: string): void;
+	/** The id of the current aria-activedescendant of the autocomplete input. */
+	focusedNodeId: string | null;
+	/** Sets the id of the current aria-activedescendant of the autocomplete input. */
+	setFocusedNodeId(value: string | null): void;
+}
+
+export interface AutocompleteProps {
+	/** The value of the autocomplete input (controlled). */
+	inputValue?: string;
+	/** The default value of the autocomplete input (uncontrolled). */
+	defaultInputValue?: string;
+	/** Handler that is called when the autocomplete input value changes. */
+	onInputChange?: (value: string) => void;
+	/**
+	 * The children wrapped by the autocomplete. Consists of at least an input element and a
+	 * collection element to filter.
+	 */
+	children: ReactNode;
+}
+
+// Emulate our other stately hooks which accept all "base" props even if not used
+export interface AutocompleteStateOptions extends Omit<AutocompleteProps, 'children'> {}
+
+/**
+ * Provides state management for an autocomplete component.
+ */
+export function useAutocompleteState(props: AutocompleteStateOptions): AutocompleteState;
+// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
+export function useAutocompleteState(
+	props: AutocompleteStateOptions,
+	slot: symbol | undefined,
+): AutocompleteState;
+export function useAutocompleteState(...args: any[]): AutocompleteState {
+	const [user, slotArg] = splitSlot(args);
+	const slot = slotArg ?? S('useAutocompleteState');
+	const props = user[0] as AutocompleteStateOptions;
+
+	let {
+		onInputChange: propsOnInputChange,
+		inputValue: propsInputValue,
+		defaultInputValue: propsDefaultInputValue = '',
+	} = props;
+
+	let onInputChange = (value: string) => {
+		if (propsOnInputChange) {
+			propsOnInputChange(value);
+		}
+	};
+
+	let [focusedNodeId, setFocusedNodeId] = useState<string | null>(
+		null,
+		subSlot(slot, 'focusedNodeId'),
+	);
+	let [inputValue, setInputValue] = useControlledState(
+		propsInputValue,
+		propsDefaultInputValue!,
+		onInputChange,
+		subSlot(slot, 'inputValue'),
+	);
+
+	return {
+		inputValue,
+		setInputValue,
+		focusedNodeId,
+		setFocusedNodeId,
+	};
+}

package/src/stately/grid/GridCollection.ts

@@ -0,0 +1,200 @@
+// Ported from react-stately (source: .react-spectrum/packages/react-stately/src/grid/GridCollection.ts).
+// Verbatim (no React surface).
+import type { Collection, Key, Node } from '@react-types/shared';
+
+export interface IGridCollection<T> extends Collection<GridNode<T>> {
+	/** The number of columns in the grid. */
+	columnCount: number;
+	/** A list of rows in the grid. */
+	rows: GridNode<T>[];
+}
+
+export interface GridRow<T> extends Partial<GridNode<T>> {
+	key?: Key;
+	type: string;
+	childNodes: Iterable<Node<T>>;
+}
+
+export interface GridNode<T> extends Node<T> {
+	column?: GridNode<T>;
+	/**
+	 * The number of columns spanned by this cell. Use `colSpan` instead.
+	 *
+	 * @deprecated
+	 */
+	colspan?: number;
+	/** The number of columns spanned by this cell. */
+	colSpan?: number | null;
+	/** The column index of this cell, accounting for any colSpans. */
+	colIndex?: number | null;
+	/** The index of this node within its parent, ignoring sibling nodes that aren't of the same type. */
+	indexOfType?: number;
+}
+
+interface GridCollectionOptions<T> {
+	columnCount: number;
+	items: GridRow<T>[];
+	visitNode?: (cell: GridNode<T>) => GridNode<T>;
+}
+
+export class GridCollection<T> implements IGridCollection<T> {
+	keyMap: Map<Key, GridNode<T>> = new Map();
+	columnCount: number;
+	rows: GridNode<T>[];
+
+	constructor(opts: GridCollectionOptions<T>) {
+		this.keyMap = new Map();
+		this.columnCount = opts?.columnCount;
+		this.rows = [];
+
+		let visit = (node: GridNode<T>) => {
+			// If the node is the same object as the previous node for the same key,
+			// we can skip this node and its children. We always visit columns though,
+			// because we depend on order to build the columns array.
+			let prevNode = this.keyMap.get(node.key);
+			if (opts.visitNode) {
+				node = opts.visitNode(node);
+			}
+
+			this.keyMap.set(node.key, node);
+
+			let childKeys = new Set();
+			let last: GridNode<T> | null = null;
+			let rowHasCellWithColSpan = false;
+
+			if (node.type === 'item') {
+				for (let child of node.childNodes) {
+					if (child.props?.colSpan !== undefined) {
+						rowHasCellWithColSpan = true;
+						break;
+					}
+				}
+			}
+
+			for (let child of node.childNodes as Iterable<GridNode<T>>) {
+				if (child.type === 'cell' && rowHasCellWithColSpan) {
+					child.colspan = child.props?.colSpan;
+					child.colSpan = child.props?.colSpan;
+					child.colIndex = !last
+						? child.index
+						: (last.colIndex ?? last.index) + (last.colSpan ?? 1);
+				}
+
+				if (child.type === 'cell' && child.parentKey == null) {
+					// if child is a cell parent key isn't already established by the collection, match child node to parent row
+					child.parentKey = node.key;
+				}
+				childKeys.add(child.key);
+
+				if (last) {
+					last.nextKey = child.key;
+					child.prevKey = last.key;
+				} else {
+					child.prevKey = null;
+				}
+
+				visit(child);
+				last = child;
+			}
+
+			if (last) {
+				last.nextKey = null;
+			}
+
+			// Remove deleted nodes and their children from the key map
+			if (prevNode) {
+				for (let child of prevNode.childNodes) {
+					if (!childKeys.has(child.key)) {
+						remove(child);
+					}
+				}
+			}
+		};
+
+		let remove = (node: GridNode<T>) => {
+			this.keyMap.delete(node.key);
+			for (let child of node.childNodes) {
+				if (this.keyMap.get(child.key) === child) {
+					remove(child);
+				}
+			}
+		};
+
+		let last: GridNode<T> | null = null;
+		for (let [i, node] of opts.items.entries()) {
+			let rowNode: GridNode<T> = {
+				...node,
+				level: node.level ?? 0,
+				key: node.key ?? 'row-' + i,
+				type: node.type ?? 'row',
+				value: node.value ?? null,
+				hasChildNodes: true,
+				childNodes: [...node.childNodes],
+				rendered: node.rendered,
+				textValue: node.textValue ?? '',
+				index: node.index ?? i,
+			};
+
+			if (last) {
+				last.nextKey = rowNode.key;
+				rowNode.prevKey = last.key;
+			} else {
+				rowNode.prevKey = null;
+			}
+
+			this.rows.push(rowNode);
+			visit(rowNode);
+
+			last = rowNode;
+		}
+
+		if (last) {
+			last.nextKey = null;
+		}
+	}
+
+	*[Symbol.iterator](): IterableIterator<GridNode<T>> {
+		yield* [...this.rows];
+	}
+
+	get size(): number {
+		return [...this.rows].length;
+	}
+
+	getKeys(): IterableIterator<Key> {
+		return this.keyMap.keys();
+	}
+
+	getKeyBefore(key: Key): Key | null {
+		let node = this.keyMap.get(key);
+		return node ? (node.prevKey ?? null) : null;
+	}
+
+	getKeyAfter(key: Key): Key | null {
+		let node = this.keyMap.get(key);
+		return node ? (node.nextKey ?? null) : null;
+	}
+
+	getFirstKey(): Key | null {
+		return [...this.rows][0]?.key;
+	}
+
+	getLastKey(): Key | null {
+		let rows = [...this.rows];
+		return rows[rows.length - 1]?.key;
+	}
+
+	getItem(key: Key): GridNode<T> | null {
+		return this.keyMap.get(key) ?? null;
+	}
+
+	at(idx: number): GridNode<T> | null {
+		const keys = [...this.getKeys()];
+		return this.getItem(keys[idx]);
+	}
+
+	getChildren(key: Key): Iterable<GridNode<T>> {
+		let node = this.keyMap.get(key);
+		return node?.childNodes || [];
+	}
+}

package/src/stately/grid/useGridState.ts

@@ -0,0 +1,160 @@
+// Ported from react-stately (source: .react-spectrum/packages/react-stately/src/grid/useGridState.ts).
+// octane adaptations: public-hook slot threading (splitSlot/subSlot) per the binding
+// convention; upstream's conditional `useMultipleSelectionState` call (behind
+// `UNSAFE_selectionState`) is valid octane — hooks are slot-keyed, not order-keyed;
+// explicit dependency arrays are kept verbatim (they retain React's exact behavior
+// in octane).
+import type { Key } from '@react-types/shared';
+import { useEffect, useMemo, useRef } from 'octane';
+
+import { S, splitSlot, subSlot } from '../../internal';
+import { getChildNodes, getFirstItem, getLastItem } from '../collections/getChildNodes';
+import type { GridNode, IGridCollection } from './GridCollection';
+import type { MultipleSelectionState } from '../selection/types';
+import {
+	type MultipleSelectionStateProps,
+	useMultipleSelectionState,
+} from '../selection/useMultipleSelectionState';
+import { SelectionManager } from '../selection/SelectionManager';
+
+export interface GridState<T, C extends IGridCollection<T>> {
+	collection: C;
+	/** A set of keys for rows that are disabled. */
+	disabledKeys: Set<Key>;
+	/** A selection manager to read and update row selection state. */
+	selectionManager: SelectionManager;
+	/**
+	 * Whether keyboard navigation is disabled, such as when the arrow keys should be handled by a
+	 * component within a cell.
+	 */
+	isKeyboardNavigationDisabled: boolean;
+}
+
+export interface GridStateOptions<
+	T,
+	C extends IGridCollection<T>,
+> extends MultipleSelectionStateProps {
+	collection: C;
+	disabledKeys?: Iterable<Key>;
+	focusMode?: 'row' | 'cell';
+	/** @private - Do not use unless you know what you're doing. */
+	UNSAFE_selectionState?: MultipleSelectionState;
+}
+
+/**
+ * Provides state management for a grid component. Handles row selection and focusing a grid cell's
+ * focusable child if applicable.
+ */
+export function useGridState<T extends object, C extends IGridCollection<T>>(
+	props: GridStateOptions<T, C>,
+): GridState<T, C>;
+// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
+export function useGridState<T extends object, C extends IGridCollection<T>>(
+	props: GridStateOptions<T, C>,
+	slot: symbol | undefined,
+): GridState<T, C>;
+export function useGridState(...args: any[]): GridState<any, IGridCollection<any>> {
+	const [user, slotArg] = splitSlot(args);
+	const slot = slotArg ?? S('useGridState');
+	const props = user[0] as GridStateOptions<any, IGridCollection<any>>;
+
+	let { collection, focusMode } = props;
+	let selectionState =
+		props.UNSAFE_selectionState || useMultipleSelectionState(props, subSlot(slot, 'selection'));
+	let disabledKeys = useMemo(
+		() => (props.disabledKeys ? new Set(props.disabledKeys) : new Set<Key>()),
+		[props.disabledKeys],
+		subSlot(slot, 'disabled'),
+	);
+
+	let setFocusedKey = selectionState.setFocusedKey;
+	selectionState.setFocusedKey = (key, child) => {
+		// If focusMode is cell and an item is focused, focus a child cell instead.
+		if (focusMode === 'cell' && key != null) {
+			let item = collection.getItem(key);
+			if (item?.type === 'item') {
+				let children = getChildNodes(item, collection);
+				if (child === 'last') {
+					key = getLastItem(children)?.key ?? null;
+				} else {
+					key = getFirstItem(children)?.key ?? null;
+				}
+			}
+		}
+
+		setFocusedKey(key, child);
+	};
+
+	let selectionManager = useMemo(
+		() => new SelectionManager(collection, selectionState),
+		[collection, selectionState],
+		subSlot(slot, 'manager'),
+	);
+
+	// Reset focused key if that item is deleted from the collection.
+	const cachedCollection = useRef<IGridCollection<any> | null>(null, subSlot(slot, 'cached'));
+	useEffect(
+		() => {
+			if (
+				selectionState.focusedKey != null &&
+				cachedCollection.current &&
+				!collection.getItem(selectionState.focusedKey)
+			) {
+				const node = cachedCollection.current.getItem(selectionState.focusedKey);
+				const parentNode =
+					node?.parentKey != null &&
+					(node.type === 'cell' || node.type === 'rowheader' || node.type === 'column')
+						? cachedCollection.current.getItem(node.parentKey)
+						: node;
+				if (!parentNode) {
+					selectionState.setFocusedKey(null);
+					return;
+				}
+				const cachedRows = cachedCollection.current.rows;
+				const rows = collection.rows;
+				const diff = cachedRows.length - rows.length;
+				let index = Math.min(
+					diff > 1 ? Math.max(parentNode.index - diff + 1, 0) : parentNode.index,
+					rows.length - 1,
+				);
+				let newRow: GridNode<any> | null = null;
+				while (index >= 0) {
+					if (!selectionManager.isDisabled(rows[index].key) && rows[index].type !== 'headerrow') {
+						newRow = rows[index];
+						break;
+					}
+					// Find next, not disabled row.
+					if (index < rows.length - 1) {
+						index++;
+						// Otherwise, find previous, not disabled row.
+					} else {
+						if (index > parentNode.index) {
+							index = parentNode.index;
+						}
+						index--;
+					}
+				}
+				if (newRow) {
+					const childNodes = newRow.hasChildNodes ? [...getChildNodes(newRow, collection)] : [];
+					const keyToFocus =
+						newRow.hasChildNodes && parentNode !== node && node && node.index < childNodes.length
+							? childNodes[node.index].key
+							: newRow.key;
+					selectionState.setFocusedKey(keyToFocus);
+				} else {
+					selectionState.setFocusedKey(null);
+				}
+			}
+			cachedCollection.current = collection;
+		},
+		[collection, selectionManager, selectionState, selectionState.focusedKey],
+		subSlot(slot, 'focusReset'),
+	);
+
+	return {
+		collection,
+		disabledKeys,
+		isKeyboardNavigationDisabled: false,
+		selectionManager,
+	};
+}