<commit_before># Events

## onAppLaunched

Called once the app is launched. This event is used to set the Application's initial layout - after which the app is ready for user interaction.

```js
Navigation.events().registerAppLaunchedListener(() => {

});
```

## componentDidAppear
Called each time this component appears on screen (attached to the view heirarchy)

```js
class MyComponent extends Component {
  componentDidAppear() {

  }
}
```

This event can be observed globally as well:

```js
Navigation.events().registerComponentDidAppearListener((componentId, componentName) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**componentId**| Id of the appearing component|
|**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`|

## componentDidDisappear
Called each time this component disappears from screen (detached from the view heirarchy)

```js
class MyComponent extends Component {
  componentDidAppear() {

  }
}
```

This event can be observed globally as well:

```js
Navigation.events().registerComponentDidDisappearListener((componentId, componentName) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**componentId**| Id of the disappearing component|
|**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`|

## registerCommandListener
The `commandListener` is called whenever a *Navigation command* (i.e push, pop, showModal etc) is invoked.

```js
Navigation.events().registerCommandListener((name, params) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**name** | The name of the command that was invoked. For example `push`|
|**params**|`commandId`: Each command is assigned a unique Id<br>`componentId`: Optional, the componentId passed to the command<br>`layout`: Optional, If the command invoked created a screen. Slim representation of the component and its options |

## registerCommandCompletedListener
Invoked when a command finishes executing in native. If the command contains animations, for example pushed screen animation,) the listener is invoked after the animation ends.

```js
Navigation.events().registerCommandCompletedListener((commandId, completionTime, params) => {

});
```

|       Parameter         | Description |
|:--------------------:|:-----|
|**commandId** | Id of the completed command|
|**completionTime**|Timestamp when the comand, and consecutive animations, completed.|


## onNavigationButtonPressed
Called when a TopBar button is pressed.
```js
class MyComponent extends Component {
  onNavigationButtonPressed(buttonId) {

  }
}
```

## onSearchBarUpdated (iOS 11+ only)
Called when a SearchBar from NavigationBar gets updated.
```js
class MyComponent extends Component {
  onSearchBarUpdated(query, isFocused) {

  }
}<commit_msg>Document nativeEventListener<commit_after># Events

## onAppLaunched

Called once the app is launched. This event is used to set the Application's initial layout - after which the app is ready for user interaction.

```js
Navigation.events().registerAppLaunchedListener(() => {

});
```

## componentDidAppear
Called each time this component appears on screen (attached to the view heirarchy)

```js
class MyComponent extends Component {
  componentDidAppear() {

  }
}
```

This event can be observed globally as well:

```js
Navigation.events().registerComponentDidAppearListener((componentId, componentName) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**componentId**| Id of the appearing component|
|**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`|

## componentDidDisappear
Called each time this component disappears from screen (detached from the view heirarchy)

```js
class MyComponent extends Component {
  componentDidAppear() {

  }
}
```

This event can be observed globally as well:

```js
Navigation.events().registerComponentDidDisappearListener((componentId, componentName) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**componentId**| Id of the disappearing component|
|**componentName**|Registered name used when registering the component with `Navigation.registerComponent()`|

## registerCommandListener
The `commandListener` is called whenever a *Navigation command* (i.e push, pop, showModal etc) is invoked.

```js
Navigation.events().registerCommandListener((name, params) => {

});
```
|       Parameter         | Description |
|:--------------------:|:-----|
|**name** | The name of the command that was invoked. For example `push`|
|**params**|`commandId`: Each command is assigned a unique Id<br>`componentId`: Optional, the componentId passed to the command<br>`layout`: Optional, If the command invoked created a screen. Slim representation of the component and its options |

## registerCommandCompletedListener
Invoked when a command finishes executing in native. If the command contains animations, for example pushed screen animation,) the listener is invoked after the animation ends.

```js
Navigation.events().registerCommandCompletedListener((commandId, completionTime, params) => {

});
```

|       Parameter         | Description |
|:--------------------:|:-----|
|**commandId** | Id of the completed command|
|**completionTime**|Timestamp when the command, and consecutive animations, completed.|

## registerNativeEventListener

The nativeEvent listener is used to track various events that originate in the native aspect of the app, primarily UI events.

### `bottomTabSelected` event
This event is emitted whenever a BottomTab is selected by the user
|Parameter|Description|
|:-:|:-|
|**name**|`bottomTabSelected`|
|**params**|`unselectedTabIndex`: The index of the previously selected tab<br>`selectedTabIndex`: The index of the newly selected tab|

### `buttonPressed` event
This event is emitted whenever a TopBat button is pressed by the user
|Parameter|Description|
|:-:|:-|
|**name**|`buttonPressed`|
|**params**|`componentId`: `componentId` of the layout element the pressed button is bound to<br>`buttonId`: `id` of the pressed button|

## onNavigationButtonPressed
Called when a TopBar button is pressed.
```js
class MyComponent extends Component {
  onNavigationButtonPressed(buttonId) {

  }
}
```

## onSearchBarUpdated (iOS 11+ only)
Called when a SearchBar from NavigationBar gets updated.
```js
class MyComponent extends Component {
  onSearchBarUpdated(query, isFocused) {

  }
}
{'fraction_non_alphanumeric': 0.13972478451534856, 'fraction_numerical': 0.0006048691970361409, 'mean_word_length': 4.421311475409836, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5653044', 'n_tokens_mistral': 1767, 'n_tokens_neox': 1669, 'n_words': 628}