docs(input,searchbar): setFocus usage within overlays (#27142)

<!-- Please refer to our contributing documentation for any questions on
submitting a pull request, or let us know here if you need any help:
https://ionicframework.com/docs/building/contributing -->

<!-- Some docs updates need to be made in the `ionic-docs` repo, in a
separate PR. See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation
for details. -->

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

The `setFocus` method does not mention extra implementation details
required when working within an overlay.

<!-- Issues are required for both bug fixes and features. -->
Issue URL: N/A


## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Adds additional detail about how to use `setFocus()` when inside an
overlay
- Aligns the `ion-searchbar` documentation to match the `ion-input`
documentation

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
This commit is contained in:
Sean Perkins
2023-04-10 14:13:26 -04:00
committed by GitHub
parent ca9b9b65d2
commit aba8b44f91
3 changed files with 12 additions and 3 deletions

View File

@ -1270,7 +1270,7 @@ export namespace Components {
*/
"required": boolean;
/**
* Sets focus on the native `input` in `ion-input`. Use this method instead of the global `input.focus()`. Developers who wish to focus an input when a page enters should call `setFocus()` in the `ionViewDidEnter()` lifecycle method.
* Sets focus on the native `input` in `ion-input`. Use this method instead of the global `input.focus()`. Developers who wish to focus an input when a page enters should call `setFocus()` in the `ionViewDidEnter()` lifecycle method. Developers who wish to focus an input when an overlay is presented should call `setFocus` after `didPresent` has resolved.
*/
"setFocus": () => Promise<void>;
/**
@ -2583,7 +2583,7 @@ export namespace Components {
*/
"searchIcon"?: string;
/**
* Sets focus on the specified `ion-searchbar`. Use this method instead of the global `input.focus()`.
* Sets focus on the native `input` in `ion-searchbar`. Use this method instead of the global `input.focus()`. Developers who wish to focus an input when a page enters should call `setFocus()` in the `ionViewDidEnter()` lifecycle method. Developers who wish to focus an input when an overlay is presented should call `setFocus` after `didPresent` has resolved.
*/
"setFocus": () => Promise<void>;
/**

View File

@ -397,6 +397,9 @@ export class Input implements ComponentInterface {
*
* Developers who wish to focus an input when a page enters
* should call `setFocus()` in the `ionViewDidEnter()` lifecycle method.
*
* Developers who wish to focus an input when an overlay is presented
* should call `setFocus` after `didPresent` has resolved.
*/
@Method()
async setFocus() {

View File

@ -243,8 +243,14 @@ export class Searchbar implements ComponentInterface {
}
/**
* Sets focus on the specified `ion-searchbar`. Use this method instead of the global
* Sets focus on the native `input` in `ion-searchbar`. Use this method instead of the global
* `input.focus()`.
*
* Developers who wish to focus an input when a page enters
* should call `setFocus()` in the `ionViewDidEnter()` lifecycle method.
*
* Developers who wish to focus an input when an overlay is presented
* should call `setFocus` after `didPresent` has resolved.
*/
@Method()
async setFocus() {