Commit Graph

17 Commits

Author SHA1 Message Date
Samuel Susla 5223127abc Use plugins for TextInput component
Summary:
Leverage plugin infra for `TextInput`

Changelog: [Internal]

Reviewed By: mdvacca

Differential Revision: D21407584

fbshipit-source-id: 48b1a69aa834ab956724e6617197da57ccf99aa7
2020-05-11 09:01:34 -07:00
Samuel Susla b871979a89 Do not send events for changes coming from JavaScript
Summary:
Changelog: [Internal]

When there is a change coming from javascript, avoid triggering `onChange ` and `onSelectionChange` events since JavaScript already has these changes. This is only necessary for multiline text.

For changes coming through view commands, do not increment `_mostRecentEventCount`.

Reviewed By: shergin

Differential Revision: D21255228

fbshipit-source-id: e972dab0eb3dd21f611ee5c71d755bab593ae9cc
2020-04-27 12:33:44 -07:00
Samuel Susla 027e8f9b16 Send key when onKeyPress event is fired from TextInput
Summary:
Changelog: [Internal]

In `onKeyPress` event, we were not returning `key` property. This diff adds `key` property to `onKeyPress` event and removes other, redundant properties from `onKeyPress` event.

The implementation has been translated from Paper.

Reviewed By: shergin

Differential Revision: D21250411

fbshipit-source-id: f1e31381667acb9dec02d0b33883df8f8f5b2a4b
2020-04-27 12:33:44 -07:00
Samuel Susla 57099962b7 Apply placeholderColor to TextInput component
Summary:
Changelog: [Internal]

TextInput's `placeholderTextColor` prop was being ignored. This diff fixes that.

Reviewed By: JoshuaGross

Differential Revision: D21064118

fbshipit-source-id: 33f148c355cee846db010153e0c65ea43155c3c9
2020-04-20 10:13:56 -07:00
Samuel Susla b861782562 Remove setMostRecentEventCount from TextInput view commands
Summary:
Changelog: [Internal]

We don't use view command `setMostRecentEventCount`, let's get rid of it.

Reviewed By: JoshuaGross

Differential Revision: D21016600

fbshipit-source-id: 6491c063e9d6a89252300cb47c010b248e473f4b
2020-04-14 15:27:59 -07:00
Samuel Susla 00c4d950cf Implement event count for TextInput
Summary:
Changelog: [Internal]

Implementation of event count for Fabric's Text input.

Reviewed By: JoshuaGross

Differential Revision: D20800185

fbshipit-source-id: 988692cb2fc786649821cccb06e629b40b9b0479
2020-04-09 03:44:55 -07:00
Samuel Susla 0ef63d0cac Maintain selection and cursor location when setting string on TextInput
Summary:
Changelog: [Internal]

Calling `_backedTextInputView.attributedText = attributedString` causes cursor to be moved to the end of text input.
This applies to both, `UITextField` and `UITextView`.

This is not desired as when JS sets a new text, we don't want the cursor to be moved to the end of text input.
JS has the option to use view commands if it wishes to move cursor somewhere.

Reviewed By: JoshuaGross

Differential Revision: D20836201

fbshipit-source-id: 9234e54cfbc5fc206f723626988e505275788aae
2020-04-09 03:44:55 -07:00
Samuel Susla 7b4889937c Switch order of onSelectionChange and onChange events send from native
Summary:
Changelog: [Internal]

UIKit uses either `UITextField` or `UITextView` as its UIKit element for `<TextInput>`. `UITextField` is for single line entry, `UITextView` is for multiline entry.

There is a problem with order of events when user types a character.

In `UITextField` (single line text entry), typing a character first triggers `onChange` event and then `onSelectionChange`. JavaScript depends on this order of events because it uses `mostRecentEventCount` from this even to communicate to native that it is in sync with changes in native.

In `UITextView` (multi line text entry), typing a character first triggers `onSelectionChange` and then `onChange`. As JS depends on the correct order of events, this can cause issues. An example would be a TextInput which changes contents based as a result of `onSelectionChange`. Those changes would be ignored as native will throw them away because JavaScript doesn't have the newest version.

Reviewed By: JoshuaGross

Differential Revision: D20836195

fbshipit-source-id: fbae3b6c0d388fc059ca2541ae980073b8e5f6c7
2020-04-09 03:44:55 -07:00
Samuel Susla 3d61dc9f36 Back out "Fix controlled TextInput with child nodes"
Summary:
Changelog: [Internal]

Original commit changeset: 1b8a2efabbfa

Original diff D20587681 breaks non-controlled text input.

Reviewed By: motiz88

Differential Revision: D20815935

fbshipit-source-id: 70577ed1e5701850ff0e30a6592945a31c2a8bec
2020-04-02 08:26:04 -07:00
Samuel Susla a40cfc05b8 Fix controlled TextInput with child nodes
Summary:
Changelog: [Internal]

# There are three changes in this diff

## _stateRevision is replaced with a BOOL
`_stateRevision` was protecting against setting attributed string that is already visible to the user. Previously this was ok because the change was only coming from native, any changes from JS were ignored.

Imagine following scenario:

1. User taps key.
2. Update state is called on component initiated by native.
3. New state is created with incremented revision by one.
4. `_stateRevision` gets set to new state's revision + 1.
5. Now JS wants to change something because it just learnt that user tapped the key.
6. New state is created again with incremented revision by one.
7. Update state is called on the component, but the change isn't applied to the text view because `_state->getRevision()` will equal `_stateRevision`.

By having a BOOL instead of number, we very explicitly mark the region in which we don't want state changes to be applied to text view.

## Calling [_backedTextInputView setAttributedText] move cursor to the end of text input
This is prevented by storing what the current selection is and applying it after `[_backedTextInputView setAttributedText]` is called.
This was previously invisible because JS wasn't changing contents of `_backedTextInputView`.

## Storing of previously applied JS attributed string in state

This is the mechanism used to detect when value of text input changes come from JavaScript. JavaScript sends text input value changes through props and as children of TextInput.
We compare what previously was set from JavaScript to what is currently being send from JavaScript and if they differ, this change is communicated to the component.
Previously only first attributed string send from JavaScript was send to the component.

# Problem

If children are used to set text input's value, then there is a case in which we can't tell what source of truth should be.

Let's take following example
We have a text field that allows only 4 characters, again this is only a problem if those 4 characters come as children, not as value.
This is a controller text input.

1. User types 1234.
2. User types 5th character.
3. JavaScript updates TextInput, saying that the content should stay 1234.
4. In `TextInputShadowNode` `hasJSUpdatedAttributedString` will be set to false, because previous JS value is the same as current JS value.

Reviewed By: shergin

Differential Revision: D20587681

fbshipit-source-id: 1b8a2efabbfa0fc87cba210570142d162efe61e6
2020-03-23 04:42:09 -07:00
Samuel Susla 56cf99a96e Validate selection range passed to setTextAndSelection
Summary:
Changelog: [Internal]

# Fabric

1. If `start` and `end` parameters in `setTextAndSelection` are -1, we don't move the cursor. Previously the cursor would be moved to beginning of text input.

2. In view commands, do not validate `eventCount`. It is passed in as undefined from JS because Fabric's text input doesn't use `eventCount`.

# Paper

1. If `start` and `end` parameters in `setTextAndSelection` are -1, we don't move the cursor. Previously the cursor would be moved to beginning of text input.

Reviewed By: shergin

Differential Revision: D20538290

fbshipit-source-id: c7aeddc25f58697254474058ce901df958321f7c
2020-03-22 06:11:35 -07:00
Samuel Susla f936b65883 Creating new state should now correctly increment state revision
Summary:
Changelog: [Internal]

# Problem

Calling `UIManager::updateState` does not increment state revision because it calls `ConcreteComponentDescriptor::createState` which creates new state with state revision 1.

# How did this propagate?

This error propagated itself in TextInput when trying to input a value, you would be only allowed to type in 1 character.

Reviewed By: JoshuaGross

Differential Revision: D20072844

fbshipit-source-id: 37b8173307e1d91d6e9c41b5ff2e185dde31cc38
2020-02-26 03:32:19 -08:00
Samuel Susla 291a2ffea2 Change behaviour of view command setTextAndSelection
Summary:
Changelog: [Internal]

When I was originally implementing this view command (D19471025), I misunderstood the desired behaviour.

The text parameter isn't meant to change text in the specified `select` but it is supposed to override text of entire text input.

Reviewed By: shergin

Differential Revision: D19793484

fbshipit-source-id: 64ba36ddfa27ac5a0adf48495cb4e985a429e005
2020-02-10 04:25:01 -08:00
Valentin Shergin a69abb419a Fabric: Using State::getRevision() instead of TextInputState::revision
Summary:
Previously, State revision number was implemented manually as part of the StateData. Now we have it as a built-in concept in State, so we can rely on that.

Changelog: [Internal] Fabric-specific internal change.

Reviewed By: JoshuaGross

Differential Revision: D19467161

fbshipit-source-id: cac907265090730cdb89207aad2b52141cda5dc6
2020-01-23 10:39:14 -08:00
Samuel Susla 6449cc4363 Implement setMostRecentEventCount and setTextAndSelection commands in TextInput
Summary:
Implements JS interface and commands in native, however it isn't connected anywhere.
Changelog: [Internal]

Reviewed By: shergin

Differential Revision: D19471025

fbshipit-source-id: 7ec53c04b38cb27b84ef06dea7a0fdb9e1deee60
2020-01-22 05:12:11 -08:00
Samuel Susla f43c9316e1 Add blur and focus native commands to TextInput
Summary:
Add Native Commands handlers to TextInput.
It is intentionally done in a way so that it can be easily swapped for codegened implementation once we properly type TextInput.

We also add native commands to view managers for backwards compatibility.

Changelog: [Internal]

Reviewed By: TheSavior, shergin

Differential Revision: D19412026

fbshipit-source-id: 8dc64275cf1da599b1bd5992a41035d51dd4148f
2020-01-20 03:08:23 -08:00
Valentin Shergin 8219db9a4a Fabric: The basic implementation of <TextInput> for iOS
Summary:
This is the partial implementation of Fabric-compatible <TextInput> component on iOS. All features are supported besides those:
 * `focus()`, `blur()`, `clear()` imperative calls;
 * Controlled TextInput as the whole feature in general;
 * Controlling selection from JavaScript side;
 * `autoFocus` prop;
 * KeyboardAccessoryView.

Changelog: [Internal]

Reviewed By: JoshuaGross

Differential Revision: D17400907

fbshipit-source-id: 0ccd0e0923293e5f504d5fae7b7ba9f048f7d259
2020-01-13 23:22:10 -08:00