radix-vue
Version:
Vue port for Radix UI Primitives.
103 lines (102 loc) • 3.42 kB
TypeScript
import type { Ref } from 'vue';
import type { PrimitiveProps } from '../Primitive';
import type { Direction, Orientation } from './utils';
export interface RovingFocusGroupProps extends PrimitiveProps {
/**
* The orientation of the group.
* Mainly so arrow navigation is done accordingly (left & right vs. up & down)
*/
orientation?: Orientation;
/**
* The direction of navigation between items.
*/
dir?: Direction;
/**
* Whether keyboard navigation should loop around
* @defaultValue false
*/
loop?: boolean;
currentTabStopId?: string | null;
defaultCurrentTabStopId?: string;
}
export type RovingFocusGroupEmits = {
'entryFocus': [event: Event];
'update:currentTabStopId': [value: string | null | undefined];
};
interface RovingContext {
orientation: Ref<Orientation | undefined>;
dir: Ref<Direction>;
loop: Ref<boolean>;
currentTabStopId: Ref<string | null | undefined>;
onItemFocus(tabStopId: string): void;
onItemShiftTab(): void;
onFocusableItemAdd(): void;
onFocusableItemRemove(): void;
}
export declare const injectRovingFocusGroupContext: <T extends RovingContext | null | undefined = RovingContext>(fallback?: T | undefined) => T extends null ? RovingContext | null : RovingContext, provideRovingFocusGroupContext: (contextValue: RovingContext) => RovingContext;
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
dir: {
type: import("vue").PropType<Direction>;
};
loop: {
type: import("vue").PropType<boolean>;
default: boolean;
};
asChild: {
type: import("vue").PropType<boolean>;
};
as: {
type: import("vue").PropType<import('../Primitive').AsTag | import("vue").Component>;
};
orientation: {
type: import("vue").PropType<Orientation>;
default: undefined;
};
currentTabStopId: {
type: import("vue").PropType<string | null>;
};
defaultCurrentTabStopId: {
type: import("vue").PropType<string>;
};
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
entryFocus: (event: Event) => void;
"update:currentTabStopId": (value: string | null | undefined) => void;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
dir: {
type: import("vue").PropType<Direction>;
};
loop: {
type: import("vue").PropType<boolean>;
default: boolean;
};
asChild: {
type: import("vue").PropType<boolean>;
};
as: {
type: import("vue").PropType<import('../Primitive').AsTag | import("vue").Component>;
};
orientation: {
type: import("vue").PropType<Orientation>;
default: undefined;
};
currentTabStopId: {
type: import("vue").PropType<string | null>;
};
defaultCurrentTabStopId: {
type: import("vue").PropType<string>;
};
}>> & {
onEntryFocus?: ((event: Event) => any) | undefined;
"onUpdate:currentTabStopId"?: ((value: string | null | undefined) => any) | undefined;
}, {
loop: boolean;
orientation: Orientation;
}, {}>, {
default?(_: {}): any;
}>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};