UNPKG

@wix/design-system

Version:

@wix/design-system

www.wixdesignsystem.com

117 lines (111 loc) • 4.77 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
### debounceMs - type: number - description: Fetch predictions debounce in milliseconds (default: 200) ### debounceFn - type: (callback: Function, debounceMs: number) => Function - description: Allows passing a custom debounce function (default: lodash debounce). Usage: (callback: Function, debounceMs: number) => Function ### optionLayout - type: "single-line" | "double-line" - description: Sets the layout of `mainLabel` and `secondaryLabel`. The possible options can be either side by side or vertically stacked. ### optionPrefix - type: ReactNode - description: Pass any component to show as the prefix of the option, e.g., text, icon. ### optionSuffix - type: ReactNode - description: Pass any component to show as the suffix of the option, e.g., text, icon, button. ### onSelect - type: (option: DropdownLayoutValueOption, getAddress: GetAddress) => void - description: Defines a callback function which is called whenever a user selects a different option in the list. ### onError - type: (error: AmbassadorHTTPError<any>) => any - description: Defines a handler for prediction fetching errors. Returns an error object. you can read these [guidelines](https://bo.wix.com/wix-docs/rnd/platformization-guidelines/errors#platformization-guidelines_errors_errors) to learn about the meaning of each error status. ### selectOnSubmit - type: boolean - description: Specifies whether to trigger `onSelect` handler when performing a Submit-Action (Enter or Tab key down). If set to true, `onSelect` will be called with the following params: `option`: an option with a label set to the input value. `getAddress`: function for retrieving additional place details uses Atlas's search function to return the closest result to the input value This is useful when looking for locations for which Atlas does not give suggestions - for example: Apartment/Apt. ### language - type: string - description: Sets the `language` to pass to the Atlas Service. Use the language code e.g. `'en'`. ### locale - type: string - description: Sets the `locale` to pass to the Atlas Service. Locale consists of language code and country code separated by a dash e.g. `'en-us'`. ### disabled - type: boolean - description: Specifies whether input is disabled. ### size - type: "small" | "medium" | "large" - description: Controls the size of the input. Default value: `medium`. ### dataHook - type: string - description: Applies a data-hook HTML attribute that can be used in the tests. ### className - type: string - description: Specifies a CSS class name to be appended to the component’s root element. - internal ### clearButton - type: boolean - description: Displays a clear button (X) on a non-empty input. - default: true ### clearButtonAriaLabel - type: string - description: Aria label for the clear button ### initialValue - type: string - description: Sets the initial input value. ### value - type: string - description: Sets a value to display (controlled mode). ### onChange - type: ChangeEventHandler - description: Defines a callback function which is called every time input value is changed. ### onFocus - type: (e?: FocusEvent<HTMLInputElement, Element> | undefined) => void - description: Defines a standard input onFocus callback. ### onBlur - type: FocusEventHandler - description: Defines a standard input onBlur callback. ### autoSelect - type: boolean - description: Specifies whether input is auto selected on focus. ### onClear - type: () => void - description: Defines a handler for getting notified upon a clear event. When passed, it displays a clear button in the input. ### status - type: "loading" | "error" | "warning" - description: Specify the status of a field. Mostly used for “loading” indication upon async request calls. ### statusMessage - type: ReactNode - description: Defines the message to display on status icon hover. If not given or empty there will be no tooltip. ### border - type: "none" | "standard" | "round" | "bottomLine" - description: Control the border style of an input. ### placeholder - type: string - description: Sets a placeholder message to display. ### noResultsText - type: ReactNode - description: Sets the message to show in a dropdown when no results are found. ### popoverProps - type: PopoverCommonProps - description: Allows to pass common popover props. ### baseUrl - type: string - description: No description ### token - type: string - description: No description ### ref - type: null | string | (instance: AtlasAddressInputImperativeActions | null) => void | RefObject<AtlasAddressInputImperativeActions> - description: Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).