Askr documentation
Generated API snapshot

@askrjs/ui/toggle-group

Exports from the declarations published in @askrjs/ui. Signatures reflect the published artifact.

Exports

This entrypoint publishes 11 exports. Use the anchored symbol rows for direct links. Type-only exports are labeled separately from runtime values.

TOGGLE_GROUP_A11Y_CONTRACTtype

TOGGLE_GROUP_A11Y_CONTRACT: { readonly GROUP_ROLE: "group"; readonly ITEM_ROLE: "button"; readonly PRESSED_ATTRIBUTE: "aria-pressed"; readonly DATA_ATTRIBUTES: { readonly slot: "data-slot"; readonly state: "data-state"; readonly disabled: "data-disabled"; readonly orientation: "data-orientation"; }; }

Accessibility contract for toggle groups.

ToggleGrouptype

ToggleGroup: (props: ToggleGroupProps) => JSX.Element

Renders a part of `toggle-group`.

ToggleGroupA11yContracttype

ToggleGroupA11yContract: typeof TOGGLE_GROUP_A11Y_CONTRACT

Type of the Toggle Group A11y Contract object.

ToggleGroupItemtype

ToggleGroupItem: { (props: ToggleGroupItemProps): JSX.Element; (props: ToggleGroupItemAsChildProps): JSX.Element; }

Renders a part of `toggle-group`. Supports polymorphic rendering via `asChild`.

ToggleGroupItemAsChildPropstype

ToggleGroupItemAsChildProps: ButtonLikeAsChildProps & ToggleGroupItemOwnProps

Props for the `asChild` (polymorphic) rendering of Toggle Group Item.

asChild
asChild: true;
children
children: JSXElement;
disabled
disabled?: boolean | undefined;
onPress
onPress?: ((event: PressEvent) => void) | undefined;
ref
ref?: Ref<Element>;
type
type?: undefined;
value
value: string;

ToggleGroupItemOwnPropstype

ToggleGroupItemOwnProps: {
  value: string;
  disabled?: boolean;
  children?: unknown;
}

Own props for Toggle Group Item, before merging with native element attributes.

children
children?: unknown;
disabled
disabled?: boolean | undefined;
value
value: string;

ToggleGroupItemPropstype

ToggleGroupItemProps: ButtonLikeProps<'button', HTMLButtonElement> & ToggleGroupItemOwnProps

Props for Toggle Group Item.

asChild
asChild?: false | undefined;
children
children?: unknown;
disabled
disabled?: boolean | undefined;
onPress
onPress?: ((event: PressEvent) => void) | undefined;
ref
ref?: Ref<HTMLButtonElement>;
type
type?: "button" | "submit" | "reset" | undefined;

ToggleGroupMultiplePropstype

ToggleGroupMultipleProps: BoxProps<'div', HTMLDivElement> & ToggleGroupSharedOwnProps & {
  type: 'multiple';
  value?: string[];
  defaultValue?: string[];
  onValueChange?: (value: string[]) => void;
}

Props for Toggle Group Multiple.

asChild
asChild?: false | undefined;
children
Supports literal, nested, array-mapped, and `For`-rendered descendants.
defaultValue
defaultValue?: string[] | undefined;
disabled
disabled?: boolean | undefined;
id
id?: string | undefined;
loop
loop?: boolean | undefined;
onValueChange
onValueChange?: ((value: string[]) => void) | undefined;
orientation
orientation?: ToggleGroupOrientation | undefined;
ref
ref?: Ref<HTMLDivElement>;
type
type: "multiple";
value
value?: string[] | undefined;

ToggleGroupPropstype

ToggleGroupProps: ToggleGroupSingleProps | ToggleGroupMultipleProps

Props for Toggle Group.

asChild
asChild?: false | undefined;
children
Supports literal, nested, array-mapped, and `For`-rendered descendants.
defaultValue
defaultValue?: string | string[] | undefined;
disabled
disabled?: boolean | undefined;
id
id?: string | undefined;
loop
loop?: boolean | undefined;
onValueChange
onValueChange?: ((value: string[]) => void) | ((value: string) => void) | undefined;
orientation
orientation?: ToggleGroupOrientation | undefined;
ref
ref?: Ref<HTMLDivElement>;
type
type?: "single" | "multiple" | undefined;
value
value?: string | string[] | undefined;

ToggleGroupSinglePropstype

ToggleGroupSingleProps: BoxProps<'div', HTMLDivElement> & ToggleGroupSharedOwnProps & {
  type?: 'single';
  value?: string;
  defaultValue?: string;
  onValueChange?: (value: string) => void;
}

Props for Toggle Group Single.

asChild
asChild?: false | undefined;
children
Supports literal, nested, array-mapped, and `For`-rendered descendants.
defaultValue
defaultValue?: string | undefined;
disabled
disabled?: boolean | undefined;
id
id?: string | undefined;
loop
loop?: boolean | undefined;
onValueChange
onValueChange?: ((value: string) => void) | undefined;
orientation
orientation?: ToggleGroupOrientation | undefined;
ref
ref?: Ref<HTMLDivElement>;
type
type?: "single" | undefined;
value
value?: string | undefined;