@instructure/ui-select 8.13.1-snapshot.9 → 8.14.1-snapshot.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/es/Select/Group/index.js +2 -3
- package/es/Select/Group/props.js +0 -7
- package/es/Select/Option/index.js +2 -2
- package/es/Select/Option/props.js +0 -27
- package/es/Select/SelectLocator.js +5 -2
- package/es/Select/index.js +92 -85
- package/es/Select/props.js +2 -142
- package/lib/Select/Group/index.js +2 -3
- package/lib/Select/Group/props.js +0 -7
- package/lib/Select/Option/index.js +2 -2
- package/lib/Select/Option/props.js +0 -27
- package/lib/Select/SelectLocator.js +3 -0
- package/lib/Select/index.js +96 -86
- package/lib/Select/props.js +2 -142
- package/package.json +23 -23
- package/src/Select/Group/index.tsx +2 -3
- package/src/Select/Group/props.ts +8 -8
- package/src/Select/Option/index.tsx +2 -2
- package/src/Select/Option/props.ts +33 -25
- package/src/Select/index.tsx +160 -168
- package/src/Select/props.ts +176 -117
- package/tsconfig.build.json +27 -2
- package/tsconfig.build.tsbuildinfo +1 -0
- package/types/Select/Group/index.d.ts +4 -5
- package/types/Select/Group/index.d.ts.map +1 -1
- package/types/Select/Group/props.d.ts +7 -1
- package/types/Select/Group/props.d.ts.map +1 -1
- package/types/Select/Option/index.d.ts +3 -7
- package/types/Select/Option/index.d.ts.map +1 -1
- package/types/Select/Option/props.d.ts +28 -4
- package/types/Select/Option/props.d.ts.map +1 -1
- package/types/Select/SelectLocator.d.ts +117 -117
- package/types/Select/index.d.ts +68 -99
- package/types/Select/index.d.ts.map +1 -1
- package/types/Select/props.d.ts +146 -21
- package/types/Select/props.d.ts.map +1 -1
package/types/Select/index.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
-
import { Component } from 'react';
|
|
2
|
+
import React, { Component } from 'react';
|
|
3
|
+
import type { OptionsItemProps, OptionsSeparatorProps } from '@instructure/ui-options';
|
|
4
|
+
import type { SelectableProps, SelectableRender } from '@instructure/ui-selectable';
|
|
3
5
|
import { jsx } from '@instructure/emotion';
|
|
4
6
|
import { Group } from './Group';
|
|
5
7
|
import { Option } from './Option';
|
|
@@ -9,151 +11,118 @@ import type { SelectProps } from './props';
|
|
|
9
11
|
category: components
|
|
10
12
|
tags: autocomplete, typeahead, combobox, dropdown, search, form
|
|
11
13
|
---
|
|
14
|
+
@tsProps
|
|
12
15
|
**/
|
|
13
16
|
declare class Select extends Component<SelectProps> {
|
|
14
17
|
static readonly componentId = "Select";
|
|
15
|
-
static allowedProps: readonly (keyof {
|
|
16
|
-
renderLabel: import("react").ReactNode | ((...args: any[]) => any);
|
|
17
|
-
inputValue?: string | undefined;
|
|
18
|
+
static allowedProps: readonly ("id" | "children" | "assistiveText" | "interaction" | "isInline" | "optionsMaxWidth" | "visibleOptionsCount" | "inputValue" | "onInputChange" | "listRef" | keyof {
|
|
18
19
|
isShowingOptions?: boolean | undefined;
|
|
19
|
-
|
|
20
|
+
onRequestShowOptions?: ((event: React.SyntheticEvent<Element, Event>) => void) | undefined;
|
|
21
|
+
onRequestHideOptions?: ((event: React.SyntheticEvent<Element, Event>) => void) | undefined;
|
|
22
|
+
onRequestHighlightOption?: ((event: React.SyntheticEvent<Element, Event>, data: {
|
|
23
|
+
id?: string | undefined;
|
|
24
|
+
direction?: 1 | -1 | undefined;
|
|
25
|
+
}) => void) | undefined;
|
|
26
|
+
onRequestSelectOption?: ((event: React.SyntheticEvent<Element, Event>, data: {
|
|
27
|
+
id?: string | undefined;
|
|
28
|
+
}) => void) | undefined;
|
|
29
|
+
} | keyof {
|
|
30
|
+
renderLabel: React.ReactNode | (() => React.ReactNode);
|
|
20
31
|
size?: "small" | "medium" | "large" | undefined;
|
|
21
|
-
assistiveText?: string | undefined;
|
|
22
32
|
placeholder?: string | undefined;
|
|
23
|
-
interaction?: "disabled" | "enabled" | "readonly" | undefined;
|
|
24
33
|
isRequired?: boolean | undefined;
|
|
25
|
-
isInline?: boolean | undefined;
|
|
26
34
|
width?: string | undefined;
|
|
27
|
-
htmlSize?:
|
|
28
|
-
optionsMaxWidth?: string | undefined;
|
|
29
|
-
visibleOptionsCount?: number | undefined;
|
|
35
|
+
htmlSize?: number | undefined;
|
|
30
36
|
messages?: import("@instructure/ui-form-field/types/FormPropTypes").FormMessage[] | undefined;
|
|
37
|
+
onFocus?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
|
|
38
|
+
onBlur?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
|
|
39
|
+
inputRef?: ((inputElement: HTMLInputElement | null) => void) | undefined;
|
|
40
|
+
renderBeforeInput?: React.ReactNode | (() => React.ReactNode);
|
|
41
|
+
renderAfterInput?: React.ReactNode | (() => React.ReactNode);
|
|
42
|
+
shouldNotWrap?: boolean | undefined;
|
|
43
|
+
} | keyof {
|
|
31
44
|
placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
|
|
32
45
|
constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
|
|
33
46
|
mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
|
|
34
|
-
onFocus?: ((...args: any[]) => any) | undefined;
|
|
35
|
-
onBlur?: ((...args: any[]) => any) | undefined;
|
|
36
|
-
onInputChange?: ((...args: any[]) => any) | undefined;
|
|
37
|
-
onRequestShowOptions?: ((...args: any[]) => any) | undefined;
|
|
38
|
-
onRequestHideOptions?: ((...args: any[]) => any) | undefined;
|
|
39
|
-
onRequestHighlightOption?: ((...args: any[]) => any) | undefined;
|
|
40
|
-
onRequestSelectOption?: ((...args: any[]) => any) | undefined;
|
|
41
|
-
inputRef?: ((...args: any[]) => any) | undefined;
|
|
42
|
-
listRef?: ((...args: any[]) => any) | undefined;
|
|
43
|
-
renderBeforeInput?: import("react").ReactNode | ((...args: any[]) => any);
|
|
44
|
-
renderAfterInput?: import("react").ReactNode | ((...args: any[]) => any);
|
|
45
|
-
shouldNotWrap?: boolean | undefined;
|
|
46
|
-
children?: import("react").ReactNode;
|
|
47
47
|
})[];
|
|
48
|
-
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
49
|
-
renderLabel: import("react").ReactNode | ((...args: any[]) => any);
|
|
50
|
-
inputValue?: string | undefined;
|
|
48
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<"id" | "children" | "assistiveText" | "interaction" | "isInline" | "optionsMaxWidth" | "visibleOptionsCount" | "inputValue" | "onInputChange" | "listRef" | keyof {
|
|
51
49
|
isShowingOptions?: boolean | undefined;
|
|
52
|
-
|
|
50
|
+
onRequestShowOptions?: ((event: React.SyntheticEvent<Element, Event>) => void) | undefined;
|
|
51
|
+
onRequestHideOptions?: ((event: React.SyntheticEvent<Element, Event>) => void) | undefined;
|
|
52
|
+
onRequestHighlightOption?: ((event: React.SyntheticEvent<Element, Event>, data: {
|
|
53
|
+
id?: string | undefined;
|
|
54
|
+
direction?: 1 | -1 | undefined;
|
|
55
|
+
}) => void) | undefined;
|
|
56
|
+
onRequestSelectOption?: ((event: React.SyntheticEvent<Element, Event>, data: {
|
|
57
|
+
id?: string | undefined;
|
|
58
|
+
}) => void) | undefined;
|
|
59
|
+
} | keyof {
|
|
60
|
+
renderLabel: React.ReactNode | (() => React.ReactNode);
|
|
53
61
|
size?: "small" | "medium" | "large" | undefined;
|
|
54
|
-
assistiveText?: string | undefined;
|
|
55
62
|
placeholder?: string | undefined;
|
|
56
|
-
interaction?: "disabled" | "enabled" | "readonly" | undefined;
|
|
57
63
|
isRequired?: boolean | undefined;
|
|
58
|
-
isInline?: boolean | undefined;
|
|
59
64
|
width?: string | undefined;
|
|
60
|
-
htmlSize?:
|
|
61
|
-
optionsMaxWidth?: string | undefined;
|
|
62
|
-
visibleOptionsCount?: number | undefined;
|
|
65
|
+
htmlSize?: number | undefined;
|
|
63
66
|
messages?: import("@instructure/ui-form-field/types/FormPropTypes").FormMessage[] | undefined;
|
|
67
|
+
onFocus?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
|
|
68
|
+
onBlur?: ((event: React.FocusEvent<HTMLInputElement, Element>) => void) | undefined;
|
|
69
|
+
inputRef?: ((inputElement: HTMLInputElement | null) => void) | undefined;
|
|
70
|
+
renderBeforeInput?: React.ReactNode | (() => React.ReactNode);
|
|
71
|
+
renderAfterInput?: React.ReactNode | (() => React.ReactNode);
|
|
72
|
+
shouldNotWrap?: boolean | undefined;
|
|
73
|
+
} | keyof {
|
|
64
74
|
placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
|
|
65
75
|
constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
|
|
66
76
|
mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
|
|
67
|
-
onFocus?: ((...args: any[]) => any) | undefined;
|
|
68
|
-
onBlur?: ((...args: any[]) => any) | undefined;
|
|
69
|
-
onInputChange?: ((...args: any[]) => any) | undefined;
|
|
70
|
-
onRequestShowOptions?: ((...args: any[]) => any) | undefined;
|
|
71
|
-
onRequestHideOptions?: ((...args: any[]) => any) | undefined;
|
|
72
|
-
onRequestHighlightOption?: ((...args: any[]) => any) | undefined;
|
|
73
|
-
onRequestSelectOption?: ((...args: any[]) => any) | undefined;
|
|
74
|
-
inputRef?: ((...args: any[]) => any) | undefined;
|
|
75
|
-
listRef?: ((...args: any[]) => any) | undefined;
|
|
76
|
-
renderBeforeInput?: import("react").ReactNode | ((...args: any[]) => any);
|
|
77
|
-
renderAfterInput?: import("react").ReactNode | ((...args: any[]) => any);
|
|
78
|
-
shouldNotWrap?: boolean | undefined;
|
|
79
|
-
children?: import("react").ReactNode;
|
|
80
77
|
}>;
|
|
81
78
|
static defaultProps: {
|
|
82
79
|
inputValue: string;
|
|
83
80
|
isShowingOptions: boolean;
|
|
84
81
|
size: string;
|
|
85
|
-
placeholder: null;
|
|
86
82
|
interaction: undefined;
|
|
87
83
|
isRequired: boolean;
|
|
88
84
|
isInline: boolean;
|
|
89
85
|
visibleOptionsCount: number;
|
|
90
86
|
placement: string;
|
|
91
87
|
constrain: string;
|
|
92
|
-
onFocus: (event: any) => void;
|
|
93
|
-
onBlur: (event: any) => void;
|
|
94
|
-
onRequestShowOptions: (event: any) => void;
|
|
95
|
-
onRequestHideOptions: (event: any) => void;
|
|
96
|
-
onRequestHighlightOption: (event: any, data: any) => void;
|
|
97
|
-
onRequestSelectOption: (event: any, data: any) => void;
|
|
98
|
-
inputRef: (node: any) => void;
|
|
99
|
-
listRef: (node: any) => void;
|
|
100
|
-
renderBeforeInput: null;
|
|
101
|
-
renderAfterInput: null;
|
|
102
|
-
children: null;
|
|
103
88
|
shouldNotWrap: boolean;
|
|
104
89
|
};
|
|
105
90
|
static Option: typeof Option;
|
|
106
91
|
static Group: typeof Group;
|
|
107
|
-
ref: Element | null;
|
|
108
92
|
componentDidMount(): void;
|
|
109
93
|
componentDidUpdate(): void;
|
|
110
94
|
state: {
|
|
111
95
|
hasInputRef: boolean;
|
|
112
96
|
};
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
_inputContainer
|
|
116
|
-
|
|
117
|
-
_optionIds
|
|
118
|
-
_optionHeight
|
|
97
|
+
ref: HTMLInputElement | null;
|
|
98
|
+
private _defaultId;
|
|
99
|
+
private _inputContainer;
|
|
100
|
+
private _listView;
|
|
101
|
+
private _optionIds;
|
|
102
|
+
private _optionHeight;
|
|
119
103
|
focus(): void;
|
|
120
|
-
get _input():
|
|
104
|
+
get _input(): HTMLInputElement | null;
|
|
121
105
|
get focused(): boolean | null;
|
|
122
106
|
get id(): string;
|
|
123
|
-
get width(): undefined;
|
|
107
|
+
get width(): number | undefined;
|
|
124
108
|
get interaction(): import("@instructure/ui-react-utils").InteractionType;
|
|
125
|
-
get highlightedOptionId():
|
|
126
|
-
get selectedOptionId():
|
|
127
|
-
handleInputRef: (node:
|
|
128
|
-
handleListRef: (node:
|
|
129
|
-
handleInputContainerRef: (node:
|
|
130
|
-
scrollToOption(id
|
|
131
|
-
highlightOption(event:
|
|
132
|
-
getEventHandlers():
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
onRequestHighlightLastOption: (event: any) => void;
|
|
141
|
-
onRequestSelectOption: (event: Event, { id }: {
|
|
142
|
-
id?: string | undefined;
|
|
143
|
-
}) => void;
|
|
144
|
-
} | {
|
|
145
|
-
onRequestShowOptions?: undefined;
|
|
146
|
-
onRequestHideOptions?: undefined;
|
|
147
|
-
onRequestHighlightOption?: undefined;
|
|
148
|
-
onRequestHighlightFirstOption?: undefined;
|
|
149
|
-
onRequestHighlightLastOption?: undefined;
|
|
150
|
-
onRequestSelectOption?: undefined;
|
|
151
|
-
};
|
|
152
|
-
renderOption(option: any, data: any): jsx.JSX.Element;
|
|
153
|
-
renderGroup(group: any, data: any): jsx.JSX.Element[];
|
|
154
|
-
renderList(data: any): jsx.JSX.Element;
|
|
109
|
+
get highlightedOptionId(): string | undefined;
|
|
110
|
+
get selectedOptionId(): string | string[] | undefined;
|
|
111
|
+
handleInputRef: (node: HTMLInputElement | null) => void;
|
|
112
|
+
handleListRef: (node: HTMLUListElement | null) => void;
|
|
113
|
+
handleInputContainerRef: (node: HTMLSpanElement | null) => void;
|
|
114
|
+
scrollToOption(id?: string): void;
|
|
115
|
+
highlightOption(event: React.SyntheticEvent, id: string): void;
|
|
116
|
+
getEventHandlers(): Partial<SelectableProps>;
|
|
117
|
+
renderOption(option: Option, data: Pick<SelectableRender, 'getOptionProps' | 'getDisabledOptionProps'>): jsx.JSX.Element;
|
|
118
|
+
renderGroup(group: Group, data: Pick<SelectableRender, 'getOptionProps' | 'getDisabledOptionProps'> & {
|
|
119
|
+
isFirstChild: boolean;
|
|
120
|
+
isLastChild: boolean;
|
|
121
|
+
afterGroup: boolean;
|
|
122
|
+
}): (React.ReactElement<OptionsItemProps, string | React.JSXElementConstructor<any>> | React.ReactElement<OptionsSeparatorProps, string | React.JSXElementConstructor<any>>)[];
|
|
123
|
+
renderList(data: Pick<SelectableRender, 'getListProps' | 'getOptionProps' | 'getDisabledOptionProps'>): jsx.JSX.Element;
|
|
155
124
|
renderIcon(): jsx.JSX.Element;
|
|
156
|
-
renderInput(data:
|
|
125
|
+
renderInput(data: Pick<SelectableRender, 'getInputProps' | 'getTriggerProps'>): jsx.JSX.Element;
|
|
157
126
|
render(): jsx.JSX.Element;
|
|
158
127
|
}
|
|
159
128
|
export default Select;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Select/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAY,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Select/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,KAAK,EAAE,EAAY,SAAS,EAAE,MAAM,OAAO,CAAA;AA2BlD,OAAO,KAAK,EACV,gBAAgB,EAChB,qBAAqB,EACtB,MAAM,yBAAyB,CAAA;AAChC,OAAO,KAAK,EACV,eAAe,EACf,gBAAgB,EACjB,MAAM,4BAA4B,CAAA;AAEnC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAIjC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1C;;;;;;GAMG;AACH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;;;;;;;;MAYlB;IAED,MAAM,CAAC,MAAM,gBAAS;IACtB,MAAM,CAAC,KAAK,eAAQ;IAEpB,iBAAiB;IAIjB,kBAAkB;IAOlB,KAAK;;MAEJ;IAED,GAAG,EAAE,gBAAgB,GAAG,IAAI,CAAO;IAEnC,OAAO,CAAC,UAAU,CAAgB;IAClC,OAAO,CAAC,eAAe,CAA+B;IACtD,OAAO,CAAC,SAAS,CAAuB;IAExC,OAAO,CAAC,UAAU,CAAe;IAEjC,OAAO,CAAC,aAAa,CAAK;IAE1B,KAAK;IAIL,IAAI,MAAM,4BAMT;IAED,IAAI,OAAO,mBAEV;IAED,IAAI,EAAE,WAEL;IAED,IAAI,KAAK,uBAER;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,mBAAmB,IAAI,MAAM,GAAG,SAAS,CAuB5C;IAED,IAAI,gBAAgB,kCA6BnB;IAED,cAAc,SAAU,gBAAgB,GAAG,IAAI,UAQ9C;IAED,aAAa,SAAU,gBAAgB,GAAG,IAAI,UAS7C;IAED,uBAAuB,SAAU,eAAe,GAAG,IAAI,UAEtD;IAED,cAAc,CAAC,EAAE,CAAC,EAAE,MAAM;IAoB1B,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,EAAE,EAAE,EAAE,MAAM;IAOvD,gBAAgB,IAAI,OAAO,CAAC,eAAe,CAAC;IAiE5C,YAAY,CACV,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,GAAG,wBAAwB,CAAC;IAyD3E,WAAW,CACT,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,CACR,gBAAgB,EAChB,gBAAgB,GAAG,wBAAwB,CAC5C,GAAG;QACF,YAAY,EAAE,OAAO,CAAA;QACrB,WAAW,EAAE,OAAO,CAAA;QACpB,UAAU,EAAE,OAAO,CAAA;KACpB;IA4CH,UAAU,CACR,IAAI,EAAE,IAAI,CACR,gBAAgB,EAChB,cAAc,GAAG,gBAAgB,GAAG,wBAAwB,CAC7D;IAwDH,UAAU;IAaV,WAAW,CACT,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,eAAe,GAAG,iBAAiB,CAAC;IAmFnE,MAAM;CAwDP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
package/types/Select/props.d.ts
CHANGED
|
@@ -4,37 +4,162 @@ import type { FormMessage } from '@instructure/ui-form-field';
|
|
|
4
4
|
import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
|
|
5
5
|
import type { PlacementPropValues, PositionConstraint, PositionMountNode } from '@instructure/ui-position';
|
|
6
6
|
declare type SelectOwnProps = {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
/**
|
|
8
|
+
* The id of the text input. One is generated if not supplied.
|
|
9
|
+
*/
|
|
10
10
|
id?: string;
|
|
11
|
-
|
|
11
|
+
/**
|
|
12
|
+
* Additional helpful text to provide to screen readers about the operation
|
|
13
|
+
* of the component.
|
|
14
|
+
*/
|
|
12
15
|
assistiveText?: string;
|
|
13
|
-
|
|
16
|
+
/**
|
|
17
|
+
* Specifies if interaction with the input is enabled, disabled, or readonly.
|
|
18
|
+
* When "disabled", the input changes visibly to indicate that it cannot
|
|
19
|
+
* receive user interactions. When "readonly" the input still cannot receive
|
|
20
|
+
* user interactions but it keeps the same styles as if it were enabled.
|
|
21
|
+
*/
|
|
14
22
|
interaction?: 'enabled' | 'disabled' | 'readonly';
|
|
15
|
-
|
|
23
|
+
/**
|
|
24
|
+
* Whether the input is rendered inline with other elements or if it
|
|
25
|
+
* is rendered as a block level element.
|
|
26
|
+
*/
|
|
16
27
|
isInline?: boolean;
|
|
17
|
-
|
|
18
|
-
|
|
28
|
+
/**
|
|
29
|
+
* The max width the options list can be before option text wraps. If not
|
|
30
|
+
* set, the list will only display as wide as the text input.
|
|
31
|
+
*/
|
|
19
32
|
optionsMaxWidth?: string;
|
|
33
|
+
/**
|
|
34
|
+
* The number of options that should be visible before having to scroll.
|
|
35
|
+
*/
|
|
20
36
|
visibleOptionsCount?: number;
|
|
37
|
+
/**
|
|
38
|
+
* The value to display in the text input.
|
|
39
|
+
*/
|
|
40
|
+
inputValue?: string;
|
|
41
|
+
/**
|
|
42
|
+
* Callback fired when text input value changes.
|
|
43
|
+
*/
|
|
44
|
+
onInputChange?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;
|
|
45
|
+
/**
|
|
46
|
+
* A ref to the html `ul` element.
|
|
47
|
+
*/
|
|
48
|
+
listRef?: (listElement: HTMLUListElement | null) => void;
|
|
49
|
+
/**
|
|
50
|
+
* Children of type `<Select.Option />` or `<Select.Group />`.
|
|
51
|
+
*/
|
|
52
|
+
children?: React.ReactNode;
|
|
53
|
+
} & PropsFromSelectable & PropsFromTextInput & PropsFromPopover;
|
|
54
|
+
declare type PropsFromSelectable = {
|
|
55
|
+
/**
|
|
56
|
+
* Whether or not to show the options list.
|
|
57
|
+
*/
|
|
58
|
+
isShowingOptions?: boolean;
|
|
59
|
+
/**
|
|
60
|
+
* Callback fired requesting that the options list be shown.
|
|
61
|
+
*/
|
|
62
|
+
onRequestShowOptions?: (event: React.SyntheticEvent) => void;
|
|
63
|
+
/**
|
|
64
|
+
* Callback fired requesting that the options list be hidden.
|
|
65
|
+
*/
|
|
66
|
+
onRequestHideOptions?: (event: React.SyntheticEvent) => void;
|
|
67
|
+
/**
|
|
68
|
+
* Callback fired requesting a particular option be highlighted.
|
|
69
|
+
*/
|
|
70
|
+
onRequestHighlightOption?: (event: React.SyntheticEvent, data: {
|
|
71
|
+
id?: string;
|
|
72
|
+
direction?: 1 | -1;
|
|
73
|
+
}) => void;
|
|
74
|
+
/**
|
|
75
|
+
* Callback fired requesting a particular option be selected.
|
|
76
|
+
*/
|
|
77
|
+
onRequestSelectOption?: (event: React.SyntheticEvent, data: {
|
|
78
|
+
id?: string;
|
|
79
|
+
}) => void;
|
|
80
|
+
};
|
|
81
|
+
declare type PropsFromTextInput = {
|
|
82
|
+
/**
|
|
83
|
+
* The form field label.
|
|
84
|
+
*/
|
|
85
|
+
renderLabel: React.ReactNode | (() => React.ReactNode);
|
|
86
|
+
/**
|
|
87
|
+
* The size of the text input.
|
|
88
|
+
*/
|
|
89
|
+
size?: 'small' | 'medium' | 'large';
|
|
90
|
+
/**
|
|
91
|
+
* Html placeholder text to display when the input has no value. This should
|
|
92
|
+
* be hint text, not a label replacement.
|
|
93
|
+
*/
|
|
94
|
+
placeholder?: string;
|
|
95
|
+
/**
|
|
96
|
+
* Whether or not the text input is required.
|
|
97
|
+
*/
|
|
98
|
+
isRequired?: boolean;
|
|
99
|
+
/**
|
|
100
|
+
* The width of the text input.
|
|
101
|
+
*/
|
|
102
|
+
width?: string;
|
|
103
|
+
/**
|
|
104
|
+
* The width of the input (integer value 0 or higher), if a width is not explicitly
|
|
105
|
+
* provided via the `width` prop.
|
|
106
|
+
*
|
|
107
|
+
* Only applicable if `isInline={true}`.
|
|
108
|
+
*
|
|
109
|
+
* For more see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/size
|
|
110
|
+
*/
|
|
111
|
+
htmlSize?: number;
|
|
112
|
+
/**
|
|
113
|
+
* Displays messages and validation for the input. It should be an object
|
|
114
|
+
* with the following shape:
|
|
115
|
+
* `{
|
|
116
|
+
* text: React.ReactNode,
|
|
117
|
+
* type: One of: ['error', 'hint', 'success', 'screenreader-only']
|
|
118
|
+
* }`
|
|
119
|
+
*/
|
|
21
120
|
messages?: FormMessage[];
|
|
121
|
+
/**
|
|
122
|
+
* Callback fired when text input receives focus.
|
|
123
|
+
*/
|
|
124
|
+
onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
125
|
+
/**
|
|
126
|
+
* Callback fired when text input loses focus.
|
|
127
|
+
*/
|
|
128
|
+
onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
129
|
+
/**
|
|
130
|
+
* A ref to the html `input` element.
|
|
131
|
+
*/
|
|
132
|
+
inputRef?: (inputElement: HTMLInputElement | null) => void;
|
|
133
|
+
/**
|
|
134
|
+
* Content to display before the text input. This will commonly be an icon or
|
|
135
|
+
* tags to show multiple selections.
|
|
136
|
+
*/
|
|
137
|
+
renderBeforeInput?: React.ReactNode | (() => React.ReactNode);
|
|
138
|
+
/**
|
|
139
|
+
* Content to display after the text input. This content will replace the
|
|
140
|
+
* default arrow icons.
|
|
141
|
+
*/
|
|
142
|
+
renderAfterInput?: React.ReactNode | (() => React.ReactNode);
|
|
143
|
+
/**
|
|
144
|
+
* Prevents the default behavior of wrapping the input and rendered content
|
|
145
|
+
* when available space is exceeded.
|
|
146
|
+
*/
|
|
147
|
+
shouldNotWrap?: boolean;
|
|
148
|
+
};
|
|
149
|
+
declare type PropsFromPopover = {
|
|
150
|
+
/**
|
|
151
|
+
* The placement of the options list.
|
|
152
|
+
*/
|
|
22
153
|
placement?: PlacementPropValues;
|
|
154
|
+
/**
|
|
155
|
+
* The parent in which to constrain the placement.
|
|
156
|
+
*/
|
|
23
157
|
constrain?: PositionConstraint;
|
|
158
|
+
/**
|
|
159
|
+
* An element or a function returning an element to use mount the options
|
|
160
|
+
* list to in the DOM (defaults to `document.body`)
|
|
161
|
+
*/
|
|
24
162
|
mountNode?: PositionMountNode;
|
|
25
|
-
onFocus?: (...args: any[]) => any;
|
|
26
|
-
onBlur?: (...args: any[]) => any;
|
|
27
|
-
onInputChange?: (...args: any[]) => any;
|
|
28
|
-
onRequestShowOptions?: (...args: any[]) => any;
|
|
29
|
-
onRequestHideOptions?: (...args: any[]) => any;
|
|
30
|
-
onRequestHighlightOption?: (...args: any[]) => any;
|
|
31
|
-
onRequestSelectOption?: (...args: any[]) => any;
|
|
32
|
-
inputRef?: (...args: any[]) => any;
|
|
33
|
-
listRef?: (...args: any[]) => any;
|
|
34
|
-
renderBeforeInput?: React.ReactNode | ((...args: any[]) => any);
|
|
35
|
-
renderAfterInput?: React.ReactNode | ((...args: any[]) => any);
|
|
36
|
-
shouldNotWrap?: boolean;
|
|
37
|
-
children?: React.ReactNode;
|
|
38
163
|
};
|
|
39
164
|
declare type PropKeys = keyof SelectOwnProps;
|
|
40
165
|
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Select/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAUlD,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,WAAW,EACZ,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,0BAA0B,CAAA;AAEjC,aAAK,cAAc,GAAG;IACpB,
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Select/props.ts"],"names":[],"mappings":"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"}
|