Skip to content
This repository has been archived by the owner on Jun 11, 2021. It is now read-only.

feat(onSubmit): introduce onSubmit option #24

Merged
merged 1 commit into from
Feb 11, 2020
Merged

feat(onSubmit): introduce onSubmit option #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/autocomplete-core/defaultProps.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ export function getDefaultProps<TItem>(
environment,
shouldDropdownOpen: ({ state }) => getItemsCount(state) > 0,
onStateChange: noop,
onSubmit: noop,
...props,
// The following props need to be deeply defaulted.
initialState: {
Expand Down
11 changes: 10 additions & 1 deletion packages/autocomplete-core/propGetters.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,16 @@ export function getPropGetters<TItem>({
onSubmit: event => {
event.preventDefault();
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm wondering if preventing the default behavior should be part of the default onSubmit implementation. Are there any cases where users would like to use the default submit form event?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't see any use case where user would want to keep default submit event.


// @TODO: call the `onInputChange` or `onSubmit` user prop?
props.onSubmit({
state: store.getState(),
setHighlightedIndex,
setQuery,
setSuggestions,
setIsOpen,
setStatus,
setContext,
event,
});

store.setState(
stateReducer(store.getState(), { type: 'submit', value: null }, props)
Expand Down
14 changes: 10 additions & 4 deletions packages/autocomplete-core/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,15 +167,16 @@ export interface AutocompleteSourceOptions<TItem> {
/**
* Called when an item is selected.
*/
onSelect?: (options: ItemEventHandlerOptions<TItem>) => void;
onSelect?: (options: ItemEventHandlerParams<TItem>) => void;
}

export interface EventHandlerOptions<TItem> extends AutocompleteSetters<TItem> {
interface EventHandlerParams<TItem> extends AutocompleteSetters<TItem> {
state: AutocompleteState<TItem>;
event: Event;
}

export interface ItemEventHandlerOptions<TItem>
extends EventHandlerOptions<TItem> {
export interface ItemEventHandlerParams<TItem>
extends EventHandlerParams<TItem> {
suggestion: Suggestion<TItem>;
suggestionValue: ReturnType<AutocompleteSource['getInputValue']>;
suggestionUrl: ReturnType<AutocompleteSource['getSuggestionUrl']>;
Expand Down Expand Up @@ -285,6 +286,10 @@ export interface AutocompleteOptions<TItem> {
* The function called to determine whether the dropdown should open.
*/
shouldDropdownOpen?(options: { state: AutocompleteState<TItem> }): boolean;
/**
* The function called when the autocomplete form is submitted.
*/
onSubmit?(params: EventHandlerParams<TItem>): void;
}

export type NormalizedAutocompleteSource = {
Expand All @@ -310,4 +315,5 @@ export interface RequiredAutocompleteOptions<TItem> {
environment: Environment;
navigator: Navigator;
shouldDropdownOpen(options: { state: AutocompleteState<TItem> }): boolean;
onSubmit(params: EventHandlerParams<TItem>): void;
}