UNPKG

1.57 kBTypeScriptView Raw
1import * as React from "react";
2import { Intent } from "../../common";
3import { type ControlledValueProps, type OptionProps, type Props } from "../../common/props";
4export type SegmentedControlIntent = typeof Intent.NONE | typeof Intent.PRIMARY;
5/**
6 * SegmentedControl component props.
7 */
8export interface SegmentedControlProps extends Props, ControlledValueProps<string>, React.RefAttributes<HTMLDivElement> {
9 /**
10 * Whether the control should take up the full width of its container.
11 *
12 * @default false
13 */
14 fill?: boolean;
15 /**
16 * Whether the control should appear as an inline element.
17 */
18 inline?: boolean;
19 /**
20 * Whether this control should use large buttons.
21 *
22 * @default false
23 */
24 large?: boolean;
25 /**
26 * Visual intent to apply to the selected value.
27 */
28 intent?: SegmentedControlIntent;
29 /**
30 * List of available options.
31 */
32 options: Array<OptionProps<string>>;
33 /**
34 * Aria role for the overall component. Child buttons get appropriate roles.
35 *
36 * @see https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/examples/toolbar
37 *
38 * @default 'radiogroup'
39 */
40 role?: Extract<React.AriaRole, "radiogroup" | "group" | "toolbar">;
41 /**
42 * Whether this control should use small buttons.
43 *
44 * @default false
45 */
46 small?: boolean;
47}
48/**
49 * Segmented control component.
50 *
51 * @see https://blueprintjs.com/docs/#core/components/segmented-control
52 */
53export declare const SegmentedControl: React.FC<SegmentedControlProps>;