…edia that is set as the Featured Image (#34666)

* Replacing Image block media that is featured prompts user

If an Image block is set as the post's Featured Image, replacing the
Image block's media will prompt the user as to whether they want to
replace the Featured Image as well.

* Remove unused assignment

* Fix replace Featured Image prompt when uploading a new image

When media is uploaded as a replacement for an Image block's media, we
must await the final, non-negative ID before attempting to set the new
media as the Featured Image.

* Revert unnecessary change

* Update change log

* Disallow setting in-progress or failed uploads as featured

In-progress or failed image uploads cannot be set as the featured image
as the media does not exist on the server. Relying upon a negative ID
number did not properly disable in-progress uploads, as negative IDs are
a iOS-only coincidence due to hashing of the integer ID.

These changes rely upon media upload sync events and the presence of an
`image` prop to determine when the upload is completed successfully.

* Refactor multiple status booleans to single enum

This was done to reduce the likelihood of conflicting states. Now the
upload status can only occupy a single state.

…resolvers during unmount (#38344)

* Fix editor initialization act warnings

During editor initialization, asynchronous store resolvers leverage
`apiFetch` to fetch data from the REST API. The resolvers also rely upon
`setTimeout` to run at the end of the current JavaScript block
execution. In order to prevent "act" warnings triggered by updates to
the React tree, we manually tick fake timers and await the resolution of
`apiFetch` before proceeding.

* Resolve API fetches during editor initialization

* Flush micro tasks during editor initialization

The store resolvers perform several API fetches during editor
initialization. The most straightforward approach to ensure all of them
resolve before we consider the editor initialized is to flush micro
tasks, similar to the approach found in `@testing-library/react-native`.
https://github.com/callstack/react-native-testing-library/blob/a010ffdbca906615279ecc3abee423525e528101/src/flushMicroTasks.js#L15-L23

* Wrap long cell labels on Android

Prior to this change, the cell label container was disallowed from
shrinking to accommodate its siblings. This caused longer labels to
force the sibling elements out of the viewport causing them to be
invisible or cut-off.

Additional changes were applied to the link suggestion styles to ensure
the sibling of cell icons do not encroach upon the now static width
icon.

* Add change log entry

* Remove unnecessary style declarations

These styles are the default values and redundant.

* Expand link suggestion title to parent width

Force link suggestion title to fill parent width, which causes the link
suggestion to match the parent separator line width.

The `.tool-versions` file configures one's local environment and should
likely not be committed. Its format is defined by
[asdf-vm](https://asdf-vm.com), and is similar to
[nvm](https://github.com/nvm-sh/nvm), [rvm](https://rvm.io), or
[rbenv](https://github.com/rbenv/rbenv). Ignore this file will help
ensure the configuration is not accidentally committed to the
repository.

* Fix LinkPicker freeze when virtual keyboard is hidden

When a devices virtual keyboard is hidden, e.g. when a hardware
keyboard is connected, dismissing the `LinkPicker` resulted in the
application freezing. The freeze likely originates from an unconsumed
`LayoutAnimation` registered during resizing of the `BottomSheet`.

To address this issue, we now avoid registering a `LayoutAnimation`
whenever the changes to the header are sub-pixel values, which can
result in the `LayoutAnimation` going unconsumed. https://git.io/J9q2G

Long-term, we should likely consider refactoring the `BottomSheet` to
holistically avoid stacking `LayoutAnimations`: https://git.io/J9q2l

* Support unique BottomSheet header testID

This allows individual tests to pass a unique, top-level testID for the BottomSheet and have it propagate to the header as well, which may make querying easier.

Co-authored-by: Carlos Garcia <[email protected]>

* Fix indentation issue in bottom sheet component

* Add change log entry

* Add pull request reference to change log entry

Co-authored-by: Carlos Garcia <[email protected]>

* Upgrade base React Native packages for 0.66.2

- react-native
- react
- react-dom
- react-test-renderer
- metro-react-native-babel-preset
- metro-react-native-babel-transformer

* Remove legacy module patches

These patches have now arrived from upstream changes.

- facebook/metro@1e6cec8
- facebook/react-native@842bcb9

* Apply React Native Upgrade Helper changes

https://react-native-community.github.io/upgrade-helper/?from=0.64.0&to=0.66.1

* Apply possibly overlooked changes from React Native 0.64.0 upgrade

https://react-native-community.github.io/upgrade-helper/?from=0.61.5&to=0.64.0

* Capture pod installation changes

Result of `npm run native preios`.

* Bump version of hermes we keep on the S3 mirror

* Utilize store definition rather than store name string

Errors were thrown from `useSelect` and `useDispatch` returning
unexpected `undefined` values. Utilize the store defintion rather than
the store name string resolved the errors. There is already a movement
to use this approach in general: https://git.io/JPQW2

* Remove usage of deprecated EventEmitter.removeEventListener

This function is marked as deprecated.We should be replaced by calling
`remove` on the subscription itself. https://git.io/JPQzO

* Patch react-native-modal to remove deprecated method usage

Remove usage of deprecated `EventEmitter.removeEventListener`. This
function is marked as deprecated.We should be replaced by calling
`remove` on the subscription itself. https://git.io/JPQzO

The patch can be removed once we upgrade to
react-native-modal@^13.0.0. https://git.io/JPQgq

* Fix native Android Demo app build

Set the relative RN CLI path for the Demo app to fix broken builds when
using Android Studio, as opposed to the RN CLI directly. It appears the
[code used to locate the CLI was modified](https://git.io/JcNzp) for v0.64.0. So, our recent
React Native upgrade is likely when this issue began.

* Disable Metro inlineRequires configuration

When enabled, this option converts top-level imports into inline
requires as a performance optimization for large apps. However, it would
appear that some import side effects break, e.g. `import './hooks'`.

https://reactnative.dev/docs/ram-bundles-inline-requires#inline-requires

* Patch @react-navigation/native to remove usage of deprecated method

Remove usage of deprecated `EventEmitter.removeEventListener`. This
function is marked as deprecated.We should be replaced by calling
`remove` on the subscription itself. https://git.io/JPQzO

The patch can be removed once we upgrade to react-navigation@^6.0.0.
https://git.io/JP7OG

* Remove ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES setting

Installing pods resulted in the following warning. Given that the target
is an unused test workspace, it felt safe to remove this setting.

```
[!] The `GutenbergDemoTests [Debug]` target overrides the `ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES` build setting defined in `Pods/Target Support Files/Pods-GutenbergDemo-GutenbergDemoTests/Pods-GutenbergDemo-GutenbergDemoTests.debug.xcconfig'. This can lead to problems with the CocoaPods installation
    - Use the `$(inherited)` flag, or
    - Remove the build settings from the target.

[!] The `GutenbergDemoTests [Release]` target overrides the `ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES` build setting defined in `Pods/Target Support Files/Pods-GutenbergDemo-GutenbergDemoTests/Pods-GutenbergDemo-GutenbergDemoTests.release.xcconfig'. This can lead to problems with the CocoaPods installation
    - Use the `$(inherited)` flag, or
    - Remove the build settings from the target.
```

* Use Carthage --use-xcframeworks argument

The Carthage documentation showcases this argument. Using it resolved
the following error when running `npm run native preios:carthage`.

https://github.com/Carthage/Carthage/tree/0.38.0#quick-start

```
Building universal frameworks with common architectures is not possible. The device and simulator slices for "Aztec" both build for: arm64
Rebuild with --use-xcframeworks to create an xcframework bundle instead.
```

* Add required EventEmitter methods to address warning

The added methods are required by React Native. Otherwise, the below
warning is displayed.

https://stackoverflow.com/a/69650217/378228

```
WARN  `new NativeEventEmitter()` was called with a non-null argument without the required `addListener` method.
WARN  `new NativeEventEmitter()` was called with a non-null argument without the required `removeListeners` method.
```

* Enable LogBox to address deprecation warning

`console.disableYellowBox` is deprecated. Additionally, totally
disabling the logger increases the likelihood that we inadvertently
overlook new warnings.

* Patch react-native-keyboard-aware-scroll-view for deprecated method

This patch changed from the deprecated `componentWillReceiveProps` to
`componentDidUpdate`. We can remove this patch when we upgrade to
`react-native-keyboard-aware-scroll-view@^0.9.2`
https://git.io/JPbOK

* Fix runtime error from invoking removed method

Utilize the new versions of the scroll methods. This patch could be
removed if we upgrade to `react-native-keyboard-aware-view@^0.9.5`.
https://git.io/JPb6a

* Remove redundant listener removal

A few lines before this, `remove` is called on the subscription itself.

* Remove usage of deprecated removeEventListener method

We should use `remove` on the subscription itself instead.

* Remove IPHONEOS_DEPLOYMENT_TARGET for all Pods

Build errors occurred for `react-native-bridge` as it attempted to
target 11.0, where the editor project targets 13.0. This change lets all
Pods, except RCT-Folly, inherit the target of the project. RCT-Folly
requires an explicit target.

- https://stackoverflow.com/a/37289688/378228
- https://git.io/JPb7Y
- https://git.io/JPb73

* Capture Podfile and Xcode project changes from initial build

Result of running `npm run native ios`.

* Replace deprecated Clipboard core module

The `Clipboard` module was marked as deprecated and will be removed from
React Native core. React Native documentation recommends relying upon
the community package instead.

```
WARN  Clipboard has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '@react-native-clipboard/clipboard' instead of 'react-native'. See https://github.com/react-native-clipboard/clipboard
```

* Capture lockfile changes from subsequent npm install

These changes did not show up until the second run, unsure as to why.

* Fix mock of AccessibilityInfo

This aligns with the mock found within the React Native source itself.
Prior to this change, `AccessibilityInfo` was `undefined` within tests.
https://git.io/JXKgx

* Capture Jest snapshot updates

These changes occurred after upgrading React Native to 0.66.2. They do
not appear suspicious.

* Mark mock as an ESM default export

This mock was not properly applied, which led to the error it resolved
resurfacing in the test output. Setting `__esModule: true` signals the
mocked file is an ESM default export.

https://jestjs.io/docs/jest-object#jestmockmodulename-factory-options

* Fix illegible iOS header in Demo app

Changes to navigation bars in iOS 15 resulted in the navigation bar
becoming unexpectedly transparent when content was scrolled all the way
to the top.

https://reactnative.dev/blog/2021/09/01/preparing-your-app-for-iOS-15-and-android-12#transparent-navigation-bar

* Demote the warning to simple code comment

While at it, expand the comment with more context about why there's no
need to bump the event counter when already undefined.

* Add global source to Gemfile

This change addresses the following warning:

```
[DEPRECATED] This Gemfile does not include an explicit global source. Not using an explicit global source may result in a different lockfile being generated depending on the gems you have installed locally before bundler is run. Instead, define a global source in your Gemfile like this: source "https://rubygems.org".
```

* Remove unnecessary deprecated bundler --path argument

A Bundler configuration file already sets this value. Also, this
argument outputs the following deprecation warning:

```
[DEPRECATED] The `--path` flag is deprecated because it relies on being remembered across bundler invocations, which bundler will no longer do in future versions. Instead please use `bundle config set --local path 'vendor/bundle'`, and stop using this flag
```

* Fix non-dismissible modals caused by unnecessary height transitions

These changes refactor animations for the
`BottomSheetNavigationContainer` to reduce the likelihood of
`LayoutAnimations` remaining unconsumed.

In certain scenarios, the BottomSheet would erroneously register a
`LayoutAnimation`, but then it would never be consumed for one reason
or another. E.g. transitioning from full-height to full-height, computed
pixel height was identical, stale height value captured within memoized
callback.

Unconsumed `LayoutAnimations` appear to cause issues for React Native's
Modal component on iOS. Specifically, it can result in a transparent,
non-dismissible modal sitting atop the rest of the app UI. Upgrading to
React Native 0.66 appears to have increased the frequency of this
occurring, for an unknown reason.

- https://git.io/J1W3z
- https://git.io/J1W32
- https://git.io/J1W3a
- https://git.io/J1W3r
- https://git.io/J1W36

* Fix non-dismissible modals caused by header layout transitions

This change ensures changes to the header height are considered when
computing the allowable maximum height for the `BottomSheet`.

When the `BottomSheet` header changes its size, it configures a
`LayoutAnimation` to manage the change. It then relies upon the
`onSetHeight` callback to implement the change. In the scenario where
the _header_ layout changed, but the rest of the content did not, it
meant we attempted to set the height to the same value. This would
result in an unconsumed `LayoutAnimation` lingering as no changes
occurred which would consume the `LayoutAnimation`.

Unconsumed `LayoutAnimations` appear to cause issues for React Native's
Modal component on iOS. Specifically, it can result in a transparent,
non-dismissible modal sitting atop the rest of the app UI. Upgrading to
React Native 0.66 appears to have increased the frequency of this
occurring, for an unknown reason.

- https://git.io/J1W3z
- https://git.io/J1W32
- https://git.io/J1W3a
- https://git.io/J1W3r
- https://git.io/J1W36

* Document ignored LogBox warnings

Provide additional context as to why warnings are ignored and how we
might address them properly.

* Ignore overridden layout animations warnings

`KeyboardAvoidingView`'s usage of `LayoutAnimation` collides with both
`BottomSheet` and `NavigationContainer` usage of `LayoutAnimation`
simultaneously. Each of these components may invoke overlapping
animations, which produces this warning.

The most appropriate way to handle this is likely to migrate to
@gorhom/bottom-sheet and/or replace usage of `LayoutAnimation` with
`Animated`.

- https://git.io/J1lZv
- https://git.io/J1lZY

* Link picker dismisses iOS keyboard to ensure smooth animation

Focus of the URL text input caused animation stutter while the iOS
keyboard visibility toggled from hide to show to hide. To address this,
the Android-specific keyboard dismiss logic is now applied to iOS as
well.

When the keyboard visibility changes, the `KeyboardingAvoidingView`
configures a `LayoutAnimation` to manage the change. The quick toggle of
hide to show to hide could result in an unconsumed `LayoutAnimation`
lingering as no changes occurred which would consume the
`LayoutAnimation`.

Unconsumed `LayoutAnimations` appear to cause issues for React Native's
Modal component on iOS. Specifically, it can result in a transparent,
non-dismissible modal sitting atop the rest of the app UI. Upgrading to
React Native 0.66 appears to have increased the frequency of this
occurring, for an unknown reason.

- https://git.io/J1W3z
- https://git.io/J1W32
- https://git.io/J1W3a
- https://git.io/J1W3r
- https://git.io/J1W36

* Revert erroneous native editor package version bumps

Automation to generate web releases seems to sporadically bump the
package versions of the native editor packages by mistake. This reverts
the erroneous version changes.

* Install Pods after erroneous version bump revert

* Revert erroneous package lock change

Removing the `node_modules` directory entirely and `npm install`
resulted in this package being added back.

* Android: SafeArea sub can be null so, guard its removal

* Remove unnecessary test mock code

The implementation itself is irrelevant, we merely need the spy to
assert against the call counts.

* Avoid state updates on unmounted LinkSettingsScreen component

State updates that triggerd from calling `submit` within
`onHandleClosingBottomSheet` resulted in errors from React regarding a
potential memory leak. Since the bottom sheet is closing and component
is unmounting, there is no need to update the component state.

The `onChange` callback, however, still needs to be invoked to persist
the attribute changes. There is further opportunity to improve
`onChange` as it currently empties the attributes causing a re-render
during the close animation, which results in UI jumping.

```
 ERROR  Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
    in LinkSettingsScreen (at modal.native.js:25)
```

* Avoid unnecessary link removal while closing bottom sheet

The absence of a checking the visibility of the link settings meant
multiple calls to `removeLink` were performed while closing the bottom
sheet. This resulted in unnecessary re-renders while the bottom sheet
close animation was running, which led to poor animation performance and
potential for unconsumed `LayoutAnimation`s.

This change now only removes the link if the bottom sheet is still
visible, which matches the behavior of submitting a link.

Unconsumed `LayoutAnimation`s appear to cause issues for React Native's
Modal component on iOS. Specifically, it can result in a transparent,
non-dismissible modal sitting atop the rest of the app UI. Upgrading to
React Native 0.66 appears to have increased the frequency of this
occurring, for an unknown reason.

- https://git.io/J1W3z
- https://git.io/J1W32
- https://git.io/J1W3a
- https://git.io/J1W3r
- https://git.io/J1W36

* Pin react-native-url-polyfill to 1.1.2 that includes Buffer

* Include rest of npm install changes in package-lock

* Need to load the native part of the Clipboard package

Note: haven't done the binary/release side setup yet. We'll need to fork
the dependency to add Jitpack support as usual.

* Point the android build to the forked react-native-clipboard

* Point to the forked react-native-clipboard

* Correct integrity hash for react-native-clipboard's tarball

* Fix up the package name reference

* Point to the JitPack fix commit

* Update React Native version ref in third-party package forks (#36983)

We currently maintain a few forks of third-party packages for
modifications required for the Gutenberg mobile editor, e.g. Gradle
configuration changes. This updates the dependency versions that
reference React Native 0.66.2.

* Update third-party package forks to tag references

Tagging the third-party package fork repository is necessary for native
bridge Android integration. For sake of consistency, this updates the
git references in the `package.json` file to reference tags as well.
https://git.io/JM2bA

* Disable keyboard-related BottomSheet animations

This particular animation exasperated a preexisting bug. We chose to
disable this one animation as a temporary solution to keep the React
Native upgrade moving forward.

Long term, we should explore replacing `LayoutAnimation` usage with more
nuanced `Animated` usage or replace our custom `BottomSheet` with
`@gorhom/bottom-sheet`.

https://git.io/JMPCV

* Avoid non-dismissible modals caused by unnecessary height transitions

Transitioning height between sub-pixel values is unnecessary and
caused unconsumed LayoutAnimations which resulted in non-dismissible,
transparent modals on iOS. These changes refactor animations for the
`BottomSheetNavigationContainer` to reduce the likelihood of
`LayoutAnimations` remaining unconsumed.

In certain scenarios, the BottomSheet would erroneously register a
`LayoutAnimation`, but then it would never be consumed for one reason
or another. E.g. transitioning to height that is only a few decimal
different.

Unconsumed `LayoutAnimations` appear to cause issues for React Native's
Modal component on iOS. Specifically, it can result in a transparent,
non-dismissible modal sitting atop the rest of the app UI. Upgrading to
React Native 0.66 appears to have increased the frequency of this
occurring, for an unknown reason.

- https://git.io/J1W3z
- https://git.io/J1W32
- https://git.io/J1W3a
- https://git.io/J1W3r
- https://git.io/J1W36

* Adjust bottom sheet max height to account for header subtraction

The percentage height required changing now that we subtract the header
height from the max height calculation. The header is now subtracted to
ensure that the `LayoutAnimation` scheduled is consumed if _only_ the
header changes its height. Previously, a change in header height only
scheduled a `LayoutAnimation`, but did not modify the max height.

* Fix BottomSheet navigation hardware back button support (#37426)

An earlier addition of `setHeight` to the dependencies array meant the
callback was recreated multiple times, which led to unintentional updates
to the hardware button handler. This resulted in navigating backwards
multiple screen instead of one when pressing the hardward back button in
a deeply nested screen.

`onHandleHardwareButtonPress` stores a single value, which means
future invocations from sibling screens can replace the callback for
the currently active screen. Currently, the empty dependency array
passed to `useCallback` here is what prevents erroneous callback
replacements, but leveraging memoization to achieve this is brittle and
explicitly discouraged in the React documentation.
https://reactjs.org/docs/hooks-reference.html#usememo

Ideally, we refactor `onHandleHardwareButtonPress` to manage multiple
callbacks triggered based upon which screen is currently active.

Related: https://git.io/JD2no

* Further clarify link picker test intent

The assertions of these tests do not tell the full story of the test
expectation. Namely, due to bugs within react-native-testing-library and
its dependencies, the tests do not assert navigation events that should
occur _after_ the keyboard dismisses. Combining async renders and mocked
timers is currently quite difficult.

callstack/react-native-testing-library#379 (comment)

To clarify the intent of the test, the test description was expanded to
describe the expectation that the keyboard is dismissed prior to the
navigation event occurring. Simultaneously dismissing the keyboard and
navigating has caused performance issues in our bottom sheet before.

#37559

* Replace usage of deprecated React Native Clipboard module

The `Clipboard` module was relocated to a non-core package. This change
mirrors earlier work in this branch, but needed to be applied to
additional code that merged after the initial work. I.e. a merge
resolution resulted in old references showing up.

* Update React Native version in Gradle configuration

These stale references lingered from prior iterations of the React
Native upgrade work.

* Remove unused React Native Clipboard module mock

The React Native Clipboard module is deprecated. This project now
utilizes the recommended, third-party module
`@react-native-clipboard/clipboard` instead.

* Reinstate version ranges for react and react-dom

Using ranges avoids locking third-party projects to a specific version
when consuming the `@wordpress/element` package.

* Update outdated comments

The code related to the comments changed in previous commits.

Co-authored-by: Stefanos Togkoulidis <[email protected]>

* Release script: Update react-native-editor version to 1.65.0

* Release script: Update with changes from 'npm run core preios'

* Update change log

* Release script: Update react-native-editor version to 1.65.1

* Release script: Update with changes from 'npm run core preios'

* Use firstChild and lastChild when parsing lists from MS Word (#36019)

* Use firstChild due to lack of firstElementChild in React Native editor project.

* Use lastChild due to lack of lastElementChild in React Native editor project.

* Update release notes

Co-authored-by: Tanner Stokes <[email protected]>

The bottom sheet (react-native-modal) and sub sheet navigation (React
Navigation) have competing gesture handlers that do not work well
together at this time. E.g is possible to trigger both simultaneously.
Until we identify a way to prevent the simultaneous gesture, we are
disabling the swipe back gesture for sub sheet navigation.

…Link To menu (#34846)

* Add initial UI for Image Link To options

Displays "Media" and "Attachment Page" options within the Link To
settings for the Image block. The logic does not work for the new
options, and the implementation is rudimentary. Several `TODO(David)`
are in place for remaining work.

* Intercept link settings navigation with callback instead of string

Using a callback avoids placing context-specific props reference inside
of link settings. I.e. `imageUrl` and `attachmentPageUrl` are no longer
referenced within link settings.

* Align labels with web UI

Reusing label text from the web will likely increase familiarity and
reduce confusion for users.

* Display selected link to option in Image block settings

Display the currently selected link to option in the top-level Image
block settings.

* Reset link destination to None when removing Custom URL

* Indicate selected link to option with check mark icon

* Fix comment typo

* Display correct value mask when URL value is set

Relying upon the `placeholder` did not work correctly whenever a `value`
was set, i.e. in the case of a Custom URL. Additionally, overloading the
`placeholder` prop is confusing. The new `valueMask` prop hopefully
better communicates the intent.

* Reference Cell attached to BottomSheet component

Avoid superfluous import.

* Fix incorrect prop references

The prior references are non-existent.

* Correctly mask Custom URL value when a URL is set via a different option

Selecting Media File or Attachment Page sets a URL value. Originally,
this caused the Custom URL option to display the URL value, rather than
persistently displaying its "Search or type URL" placeholder. The Custom
URL option should only display an actual URL value if it is manually
typed or selected within the link picker.

* Avoid passing current URL to link picker if it is not custom

When the Media File or Attachment Page options are selected, a URL value
is set. Previously, this value was passed to the link picker when the
Custom URL option was subsequently selected. This meant the link picker
would be pre-populated with a (likely unidentifiable) URL that was not
manually entered by the user, which could be confusing.

* Fix stale URL value

Referencing `inputValue` from within LinkSettingsScreen resulted in a
stale value to from `useRoute`. By referencing, the `url` where the
callback is defined, we avoid this issue.

* Fix unnecessary updates to attributes that resulted in bug

Set more appropriate defaults for link settings, the new values match
the sibling state values of the components.  Previously the `undefined`
values for `label` and `rel` differed from the empty string values in
component state. This change helps avoid unnecessary calls to
`setAttributes` that occurred when the BottomSheet was closed.

In addition to being unnecessary, these additional `setAttributes` calls
caused the Image edit component to erroneously change the
`linkDestination` even though the URL had not changed.

* Fix attachment page URL

* Fix incorrect link destination set when toggling new tab or setting rel

When "Open in new tab" or "Link Rel" is modified, the URL is again
passed to be set within `setMappedAttributes`. This caused the
`linkDestination` to improperly be modified. This change now avoid
settings `linkDestination` if the URL is not changing.

* Conditionally display Attachment Page option if URL exists

External images will not have an attachment page URL, so this option
should not be displayed when the URL is undefined.

* Fix alignment for left-aligned selected icon

Toggling the icon opacity rather than the presence of the icon itself
produces the desired alignment for both selected an unselected options.

* Rename style selector to better describe intent

* Remove irrelevant comment regarding setAttributes

After reviewing the logic within `LinkSettings`, it largely manages
invoking `setAttributes` in different scenarios. Therefore, using
`setAttributes` directly makes sense for this component.

* Rename ImageOptionsScreen to ImageLinkDestinationsScreen

Attempt to better describe component intent.

* Add LinkDestination abstraction

Avoid repetition to reduce likelihood of bugs.

* Fix stale link picker value and React Navigation warning

Passing `setAttributes` resulted in a stale value within the link picker
that prohibited setting the same Custom URL twice if attempted without
closing the bottom sheet entirely. E.g. None => Custom URL => None =>
Custom URL.

Additionally, React Navigation warns about passing non-serializable
values as route params, e.g. functions.

These changes addresses both issues.

* Rename image link destination screen for consistency

* Remove Custom URL placeholder

The design of the link destination picker has less width available,
which caused layout issues for the placeholder, particularly on Android
where spacing is larger.

* Reduce spacing around left-side cell icons on Android

This diverges from Material Design guides, but provides the additional
room we require for the new image link destination picker. The Custom
URL option needs to display both an selected icon (checkmark) on the
left side as well as a value and right chevron on the right side.

* Revert "Reduce spacing around left-side cell icons on Android"

This reverts commit 2ef5f65.

* Fix select icon color

* Fix selected icon styles for dark mode

Utilize colors as directed by designer.

* Update selected icon colors

Change to colors requested by designer.

* Update change log

* Simplify unnecessarily complex conditional

`iconStyle` has a default value of `{}`.

* Reference screen name cache rather than string literal

Attempt to avoid typos.

* Remove unnecessary mappedAttributes assignment

Now that we pass each prop individually to the child component, it is
arguably simpler to destructure the props required.

* Reuse linkDestination parameter instead of new local assignment

Reassigning a destructured function parameter, instead of creating a new
local assignment, allows for fewer conditionals and less code.

* Refactor selected status of LinkDestination

Relocate the logic to allow for a single `isSelected` prop to improve
readability.

* Remove unused code

There are no references to this method in the source.

* Remove undefined callback

This prop referenced an undefined class method.

* Replace style-based key with index key

Stringifying the styles appears unnecessary, and it was also causing
missing key warnings in tests as the styles are undefined in that
context. Leveraging the index appears to be enough to satisfy both the
app and the tests.

* Refactor existing Image edit tests to avoid referencing internals

Test from the "public" API of the component and its output, rather than
internal methods. I.e. press rendered buttons instead of calling methods
by name.

* Remove unnecessary native file extension reference

Metro resolves native files by default.

* Avoid global act by awaiting specific change within Image component

The Image component invokes `getMedia` within its selector. This results
in an async resolver running, which leads to changes to the component
after the async work completes. Rather than wrapping the entire test
helper with `act`, we should target the specific change within the test
file.

* Add missing React Navigation testing setup

Per React Navigation documentation, this file should be included.
https://bit.ly/3n6Rotv

* Add note regarding React Navigation async test error

There appears to be a bug in React Navigation that causes error logs in
Jest tests. We must await the `fireEvent` that triggers the navigation
event in order to suppress the error. https://git.io/Ju35Z

* Add Image Link To tests

* Fix incorrect Link To value mask caused by stale route parameters

Originally, ImageLinkDestinationsScreen relied upon (1) differing route
parameter names from LinkPicker and (2) explicitly set `linkDestination`
while LinkPicker did not. Stale route parameters resulted in erroneous
attribute updates when swapping the link destination from Media File >
Custom URL > Media File.

This change addresses the stale route parameters by (1) unifying the
route parameter names between the two components and (2) unifying the
approach for setting `linkDestination` to be computed based upon the
URL. The URL, represented as the `inputValue` route parameter, is now
the sole route parameter.

* Fix erroneous URL display within Custom URL input

The image URL may contain query parameters for aspects like display
dimensions. This caused a comparison based upon the URL to unexpectedly
mismatch. By leveraging `linkDestination` instead, we correctly hide the
URL from the Custom URL input whenever Media File or Attachment Page is
selected.

* Format initialHtml seed consistently

* Release script: Update react-native-editor version to 1.65.0

* Release script: Update with changes from 'npm run core preios'

* Update change log

* Add bridge method to send events to host app

The addition of `sendEventToHost` enables sending arbitrary events to
the native host app, allowing the host to implement the appropriate
mechanism for a given event.

* Fix typo in comment

* Add Android sendEventToHost bridge methods

Mirror the bridge method added for iOS.

* Convert ReadableMap to HashMap

Conversion avoids "leaking" the React Native-specific ReadableMap type
to the host app.

* Improve conversion of properties to hashmap

* Fix comment typo

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Matt Chowning <[email protected]>

* Enable new block badge globally

We decided to enable the new block badge for all users.

* Update release notes

* Fix block inserter unit test

Now that block impressions are enabled for all users, we must update the
test expectation to include the `isNew` property set by
`useBlockTypeImpression`. An alternative would be to update this test to
not explicitly check the component prop, but the rendered result which
the user can see.

* Remove editor onboarding bridging methods

The bridging methods are no longer necessary now that we display editor
onboarding features for all users.

* Remove help support articles from release notes

This feature was delivered in a previous release via a beta fix.

* Remove first block editor session flag

* Remove unnecessary trailing comma

* Relocate native-specific fixture setup

Place fixture setup in fixture file rather than within test file.

Previously, there was no way to disable the autosave timer created
within `AutosaveMonitor`'s `componentDidMount` hook. This resulted in
unexpected remote drafts to be saved from within the native editor's
Unsupported Block Editor (UBE) after the timer's 60 seconds elapsed.
The UBE loads the web-based editor within a web view and leverages
`autosaveInterval` to prevent autosave creating remote drafts.

This change enables clearing the initial autosave timer by modifying
`interval` via `autosaveInterval`. Now, when the `interval` changes the
previous timer is cleared and a new timer is created with the new
`interval`.

* Release script: Update react-native-editor version to 1.63.0

* Release script: Update with changes from 'npm run core preios'

* Update react-native-editor changlog for 1.63.0

* [RNMobile] Remove unneeded memoization dependency from useBlockEditorSettings (#35289)

* Release script: Update react-native-editor version to 1.63.1

* Release script: Update with changes from 'npm run core preios'

* Fix overflowing content for native Help screen (#35552)

* Fix overflowing content for Help screen

When navigating to a Help section child screen, the parent screen would
remain visible outside of the container. Hiding the overflow of the
containing element fixes this.

The reason this occurred for the first time now is likely because it is
the first time we have utilized the default navigation transitions for
the platforms, which is provided by React Navigation. This means the
screen animates from right to left on iOS, rather than a cross-fade.

* Update change log

* Fix invisible bottom sheet backdrop on Android (#35557)

* Fix invisible bottom sheet backdrop on Android

Animating the opacity for the initial modal results in the backdrop
provided by `react-native-modal` to never transition from transparent
to partially opaque black. The core issue was not idenfited, but it
may relate to the experimental state of LayoutAnimation for Android.
https://reactnative.dev/docs/layoutanimation

* Update change log

* Empty commit to trigger rebuilds

Attempt to resolve flaky, failing e2e tests.

Co-authored-by: Paul Von Schrottky <[email protected]>
Co-authored-by: Carlos Garcia <[email protected]>

* Fix invisible bottom sheet backdrop on Android

Animating the opacity for the initial modal results in the backdrop
provided by `react-native-modal` to never transition from transparent
to partially opaque black. The core issue was not idenfited, but it
may relate to the experimental state of LayoutAnimation for Android.
https://reactnative.dev/docs/layoutanimation

* Update change log

* Empty commit to trigger rebuilds

Attempt to resolve flaky, failing e2e tests.

* Fix overflowing content for Help screen

When navigating to a Help section child screen, the parent screen would
remain visible outside of the container. Hiding the overflow of the
containing element fixes this.

The reason this occurred for the first time now is likely because it is
the first time we have utilized the default navigation transitions for
the platforms, which is provided by React Navigation. This means the
screen animates from right to left on iOS, rather than a cross-fade.

* Update change log

We deemed the tooltip an ineffective solution to the block inserter
discovery problem. We removed it to reduce unnecessary complexity in the
code.

* Fix native BlockAlignmentControl

A recent web-centric change introduced usage of `MenuGroup` and
`MenuItem`, both of which are unsupported in the native editor
currently. This updates the conditional within `BlockAlignmentControl`
to reinstate the previous UI for the native platform.

* Fix nuanced test irregularities

Rename mistakenly named assignments, which were misleading.
Additionally, the reliance upon the default `value="left"` could lead to
a false-positive test. Changing to a none-default of `value="right"`
improves the validity of the test.

* Fix inconsistent test description

Co-authored-by: Carlos Garcia <[email protected]>

Co-authored-by: Carlos Garcia <[email protected]>

* Add tooltip display message test

* Add tap screen dismisses tooltip test

* Add keyboard hide dismisses tooltip test

* Simplify tooltip tests

* Fix React Native warning caused by webpack-oriented Jest image mock

The previous image mock was implemented following the Jest documentation
related to webpack. However, the `source` prop for React Native's Image
component does not accept strings. The previous image mock resulted in
the following warning in testing logs.

```
Warning: Failed prop type: Invalid prop `source` supplied to `Image`.
```

To address this, the previous image mock was removed in favor of relying
upon the transform that is provided by the `react-native` Jest preset.
In order to have this transform applied to images within React
Navigation, additional regex was added to `transformIgnorePatterns`.

- https://git.io/JEFo0
- https://bit.ly/3jAqaJL
- https://bit.ly/2YiuDbS
- https://git.io/JEFor
- https://git.io/JEFoK

* Add editor Help section tests

* Replace unnecessary React Hook check

Defining a functioning `remove` method for the `Keyboard` mock is more
appropriate than modifying the application code for testing purposes.
The original mock did not provide a way to remove registered callbacks,
which resulted in stale callbacks updating React state erroneously.

* Remove redundant assertion

A sibling test asserts the presence of this text. The presence of the
back button also provides similar coverage

* Use npm install instead of npm ci

Temporarily change install method to circumvent erroneous CI failures.

* Revert "Use npm install instead of npm ci"

This reverts commit ba00594.

Increase the accuracy of the swipe distance required to scroll one page
of blocks within the block inserter. We now have more than two pages of
blocks. The previous implementation would scroll too far (to the
bottom), which caused failures when the test scrolled _past_ the subject
block.

* Fix missing React key error in QueryControls

Replace the returned array of children with a React Fragment, to avoid
the need to set `key` for each child and avoid the following error.

ERROR  Warning: Each child in a list should have a unique "key" prop. See https://reactjs.org/link/warning-keys for more information.

* Fix ColorPalette font weight warning

Replace invalid `medium` value with valid `500` value. This addresses
the following warning found in the Metro server logs.

ERROR  Warning: Failed prop type: Invalid prop `fontWeight` of value `medium` supplied to `Text`, expected one of ["normal","bold","100","200","300","400","500","600","700","800","900"].
Bad object: {
  "fontSize": 16,
  "color": "#2e4453",
  "letterSpacing": 1.25,
  "fontWeight": "medium"
}

* Add Dark Mode-specific images to Help section

Reduce the harshness of visual illustrations while Dark Mode is enabled.

* Avoid spreading props on React component

Spreading props can lead to performance degradations that are difficult
to identify later.

* Add Dark Mode-specific image support to HelpDetailImage

Create abstraction to avoid repeated pattern for most editor help
images.

Animated now requires setting an explicit `useNativeDriver` option.
Without setting it, the following warning is produced.

```
WARN  Animated: `useNativeDriver` was not specified. This is a required option and must be explicitly set to `true` or `false`
```

It cannot be set to `true` for this particular animation as it is not
supported and produces the following error.

```
ERROR  Error: Style property 'left' is not supported by native animated module
```

* Fix Column bottom sheet Android close button

Apply required margin and padding to properly align Android close
button in the Column block bottom sheet.

* Update changelog

Replace unsupported use of `flex-wrap` with dynamic setting of
`horizontal` prop. The `horizontal` prop must be `false` to have the
`numOfColumns` property take effect.

```
WARN  `flexWrap: 'wrap'` is not supported with the `VirtualizedList` components.Consider using `numColumns` with `FlatList` instead.
```

Related links:

- https://bit.ly/2UxBz3c
- https://git.io/J0prs
- https://git.io/J0prl
- https://git.io/J0pr8
- https://git.io/J0prV

* Re-enable Android e2e tests

* Pin Android emulator build ID

A breakage within Android Studio emulators caused the Android e2e tests
to fail with the following errors. To circumvent the issue, we leverage
the ability to pin the emulator to a specific build ID.

- https://git.io/JE3jX
- https://issuetracker.google.com/issues/191805460
- https://issuetracker.google.com/issues/191799887

```
dyld: lazy symbol binding failed: Symbol not found: _preadv
```

```
adb: no devices/emulators found
```

* Refactor Editor help to use BottomSheet.SubSheet component

Avoid duplicative code by leveraging the existing abstraction.

* Remove unused image asset

* Improve accessibility of headings

Adding the "header" role provides improved audible cues of the content
structure.

* Improve accessibility of visual illustration

This particular image attempts to communicate the location of the text
formatting controls.

* Avoid cursor input language within help copy

Clicking is an action specific to cursor input devices, which is not
relevant for touch input devices.

* Improve screen reader navigation within bottom sheet

Declaring text elements as headers where appropriate improves the
ability to navigate and understand content structure.

* Update styles to align with designs

Various spacing and sizing changes were required to match the design.

* Affix Help Section heading to top of bottom sheet

To improve navigation, scroll the help content separately from the
heading that remains fixed atop the bottom sheet.

* Update image assets

Fix a few broken images. Include assets for higher pixel density
displays.

* Improve dark mode styles

* Update title font weight to match design

This matches the design comp and the title found elsewhere in other
bottom sheets.

* Help section displays a full screen bottom sheet

Improve readability of large quantities of help content by leveraging a
full screen height bottom sheet.

In order to render the nested `ScrollView` at the correct height,
`flexShrink: 1` was added to the bottom sheet header element and the
`listProps`. The latter is applied to the bottom sheet child scrolling
element.

Additionally, `height: 100%` must be applied to the top-level element of
the child view rendered in this bottom sheet. This matches the link
picker implementation and ensures the element fills the parent bottom
sheet.

* Replace BottomSheet.SubSheet with individual React Navigation screens

The current `BottomSheet.SubSheet` implementation does not reset a given
sub sheets visibility when navigating backwards via the Android back
button. This results in the child content remaining visible. When
subsequently navigating to a new child, the previous child is also
displayed.

We might be able to hook into React Navigation events to resolve this,
but my exploration felt forced and not all that valuable.

* Add close button for Help section

Including a close button will make it easier to dismiss the Help section
on Android.

* Enable default platform navigation transitions and gesture

Better align with OS defaults to meet user expectations.

* Refactor to avoid unnecessary code and changes

Some code is unused, other changes were not necessary or discussed with
the original author.

* Help section title adapts to editor context

Replace "site" with "post" or "page" base on the current content type.
We may reinstate the term "site" once full-site editing features are
included in the help articles.

* Remove "The basics" panel title

The panel title provides more confusion than value as we only have one
panel currently. Once we have multiple panels, reinstating the title
would be helpful.

* Enable text selection for help content

Allow selecting and copying text from help content to improve ability to
copy terms into search engines and elsewhere.

* Increase size of NavigationHeaader tap targets

Improve usability of UI via larger tap targets for buttons.

Provides a high-level description of the intent of the
`packages/components/src/mobile` directory, which houses mobile-specific
components.

* Release script: Update react-native-editor version to 1.59.0

* Release script: Update with changes from 'npm run core preios'

* Update release notes

* Release script: Update react-native-editor version to 1.59.1

* Release script: Update with changes from 'npm run core preios'

* Mobile - Global styles - Add color to the list of styles to include in the filter (#34000)

* Rich text - toTree - Add optional chaining in replacements before accessing its type (#34020)

* Update 1.59.1 changelog

* Reinstate Unreleased section of changelog

Co-authored-by: jhnstn <[email protected]>
Co-authored-by: Gerardo Pacheco <[email protected]>

React Native added a `PROJECT_ROOT` configuration to better support
monorepos. Prior to setting this, building the Demo app in Xcode threw
errors related to the inability to find the entry `index.js` file, as it
was searching in the root directory.

Setting the `PROJECT_ROOT` appears to fix the monorepo configuration
issue.

* Closing the block inserter decrements block type impressions

In order to avoid new block badges from remaining too long, interacting
with the block inserter multiple times will cause them to eventually
disappear.

* Increase initial new block type impression count

A higher value makes more sense now that closing the block inserter
decrements the impression count by 1.

* Fix test by improving requestBlockTypeImpressions mock accuracy

This particular function is a React Native bridge method, which executes
a callback to send back the requested data.

* Refactor conditional logic to avoid computation

Iterating over the block type impressions is unnecessary when the block
inserter is opening.

* Increase default block type impression count from 10 to 40

Interacting with the block inserter is a more frequent task, so it makes
sense to use a larger default impression count.

* [wip] Add new block badge

* [wip] Impressions dictate newness and decrement when block type inserted

The new indicator is now toggled based upon the impression count for a
block type. The impression count is decremented any time the block type
is inserted.

* De-structure arguments to simplify passing arguments to parent callback

Capturing all the arguments in a single assignment simplifies passing
them to the parent callback.

* Request and set block type impressions from native iOS

* Rename native bridge methods for clarity

Avoid confusion from similarly named methods between React Hooks and
native bridge methods.

* Request and set block type impressions from native Android

* Remove unused file

This was erroneously added during exploration.

* Add getSettings mock for failing unit test

We must mock this newly referenced property in the BlockTypesTab store
selector.

* Add mocks for native bridge methods to fix failing test

Avoid unexpected test failures from missing methods.

* Abstract block type impression tracking

Avoid duplicative code between the block type tab and the block type
search results. This abstraction is one approach, likely worth iterating
on further.

* Set default impression count for core/paragraph

Impression count set for debugging purposes.

* Limit impression decrement function scope

We only need to use this function when decreasing the impression count
when a block has been inserted. So, we can make the name clearer by
simplifying its logic.

* Relocate impressions state to block editor store

Relocating the state prevents unnecessary trips across the native bridge
requesting the impression counts. Now, one request is made when the
editor session begins. The impression counts are stored in the block
editor store for easy access from within the block inserter.

* Abstract trackBlockTypeSelection argument de-structuring

This avoids a small amount of duplicative code. The method signature is
still clear from my perspective.

* Leverage shared Badge component

Improve UI consistency and avoid duplicative code through reusing an
existing Badge component. Additional props were required to make the
Badge adaptable to the space-constrained block inserter. Lastly, the
Badge mark up was simplified and unused code was removed.

* Set new block types from JavaScript

Relocated defining new block types to be co-located with the
registration of block types.

* Fix erroneous new badge on blocks

Previously, the `isNew` prop would be set to `undefined` when the editor
onboarding capability was disabled. This caused the `Badge` component to
fallback on its default configuration to be shown. By explicitly
checking for a `true` value, the badge is appropriately hidden when
editor onboarding is disabled.

* Refactor Android bridge methods to scope types

Avoid "leaking" React Native types deeper into the WPAndroid source by
performing the necessary conversions within the glue code.

* Improve NEW_BLOCK_TYPE documentation

* Update which block types are considered "new"

These three blocks types are the latest to be supported.

* Fix typo in parameter name

* Refactor Android impression count Integer to Double

This better aligns with what React Native expects and what Gson produces
when stringifying JSON. Previously, there would be mismatch type errors
between Double and Integer.

* Split tracking of editor onboarding capability and initial session

Previously, the `editorOnboarding` capability included both (1) whether
the user was within the cohort and (2) if the user had previously
launched the Gutenberg editor. The latter is utilized to only show the
initial tooltip once. However, the combination resulted in the latter
preventing the new block badges from displaying past the initial
session.

Splitting these two attributes allows for features like the new blocks
badge to remain active past the user's initial editor session.

* Remove erroneous line break

* Rename parameter to improve clarity

Single letter parameter names may cause confusion.

* Reduce padding of small badge variant

Reduce badge size to avoid collisions with block type icons.

* Add dark mode badge variant

Improve UI style consistency via dark mode support for badge.

* Increase badge border radius to match block inserter button

Improve styling consistency between block inserter button and badge.

* Relocate default count and merging of impression objects to JavaScript

This refactor de-duplicates and simplifies native host integration by
placing more logic in JavaScript.

* Add note regarding required Double type for Android

Double utilized to satisfy both React Native's expectations
(https://bit.ly/3f3tsT4) and Gson's deserialization which uses Double
for all numbers (https://bit.ly/2VfpvUv).

* Replace new indicator text badge with image

To avoid issues with i18n and UI collisions, we opted to use an emoji
image as the new indicator.

* Revert all changes to Badge component

This work no longer depends upon the Badge component, so the
modifications to it are no longer relevant to this branch.

* Change translator note to improve consistency

Other translator notes utilize the term "name" when referring to blocks.
They also do not reference the term "type."

* Update Android types to match expectations

This change should've been included in an earlier commit, but was
overlooked. It updated the code utilized by the WPAndroid app to match
the rest of the Android bridging code.

* Replace vector sparkles image with vector SVG

The monorepo configuration currently breaks serving local static images
with React Native. An inline SVG is used as a workaround for this issue
for the time being.

- https://git.io/JBV4e
- https://git.io/JBV4k

* Update sparkles icon with simplified vector asset

Addresses pixelation that particularly noticeable in dark mode.

Apply a patch for the React Native `ActivityIndicator` rendering
invisible on Android. This applies the same patch that was previously
applied to the Embed block to to React Native itself.

The core issue in React Native appears to be [wider reaching](https://git.io/JcNlc), but I chose
to [limit the scope](https://git.io/JcNla) of the patch to the one issue we are currently
facing (i.e. invisible activity indicators), as I was concerned applying
a deeper, untested change introducing regressions elsewhere.

…32934)

* Disable Android e2e tests while we investigate foundational breakage

A `adb: no devices/emulators found` error is occurring and cause every
run to fail. We intend to temporarily disable this job while we
investigate the cause to avoid causing disruptions or confusion for
contributors.

* Revert "Disable Android e2e tests while we investigate foundational breakage"

This reverts commit edb581e.

* Leverage if configuration to disable test

Previous approach did not work. Using the if configuration seems more
appropriate.

* Fix conditional logic for GitHub Action