diff --git a/__mocks__/styleMock.js b/__mocks__/styleMock.js index 28bd419865..8b56c2cb59 100644 --- a/__mocks__/styleMock.js +++ b/__mocks__/styleMock.js @@ -28,4 +28,7 @@ module.exports = { blockHolderFocused: { borderColor: 'gray', }, + 'wp-block-heading': { + minHeight: 60, + }, }; diff --git a/gutenberg b/gutenberg index a981491e4e..3f234faf8b 160000 --- a/gutenberg +++ b/gutenberg @@ -1 +1 @@ -Subproject commit a981491e4e65c99302649a4e1aff7c3822850a22 +Subproject commit 3f234faf8b811bdfd8ada5899836b3521d886163 diff --git a/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java b/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java index 5dddc22484..ccdee13968 100644 --- a/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java +++ b/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java @@ -5,6 +5,7 @@ import android.graphics.Typeface; import android.support.annotation.Nullable; import android.text.Editable; +import android.text.TextUtils; import android.text.TextWatcher; import android.util.Log; import android.util.TypedValue; @@ -63,6 +64,8 @@ public class ReactAztecManager extends SimpleViewManager { private static final String TAG = "ReactAztecText"; + private static final String BLOCK_TYPE_TAG_KEY = "tag"; + public ReactAztecManager() { initializeFocusAndBlurCommandCodes(); } @@ -302,6 +305,13 @@ public void setColor(ReactAztecText view, @Nullable Integer color) { view.setTextColor(newColor); } + @ReactProp(name = "blockType") + public void setBlockType(ReactAztecText view, ReadableMap inputMap) { + if (inputMap.hasKey(BLOCK_TYPE_TAG_KEY)) { + view.setTagName(inputMap.getString(BLOCK_TYPE_TAG_KEY)); + } + } + @ReactProp(name = "placeholder") public void setPlaceholder(ReactAztecText view, @Nullable String placeholder) { view.setHint(placeholder); @@ -489,13 +499,14 @@ public void onTextChanged(CharSequence s, int start, int before, int count) { return; } + int currentEventCount = mEditText.incrementAndGetEventCounter(); // The event that contains the event counter and updates it must be sent first. // TODO: t7936714 merge these events mEventDispatcher.dispatchEvent( new ReactTextChangedEvent( mEditText.getId(), mEditText.toHtml(false), - mEditText.incrementAndGetEventCounter())); + currentEventCount)); mEventDispatcher.dispatchEvent( new ReactTextInputEvent( @@ -504,6 +515,11 @@ public void onTextChanged(CharSequence s, int start, int before, int count) { oldText, start, start + before)); + + // Add the outer tags when the field was started empty, and only the first time the user types in it. + if (mPreviousText.length() == 0 && currentEventCount == 1 && !TextUtils.isEmpty(mEditText.getTagName())) { + mEditText.fromHtml('<' + mEditText.getTagName() + '>' + newText + "', false); + } } @Override diff --git a/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java b/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java index 95b66d86b9..3404590189 100644 --- a/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java +++ b/react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java @@ -21,7 +21,6 @@ import com.facebook.react.uimanager.UIManagerModule; import com.facebook.react.uimanager.events.EventDispatcher; import com.facebook.react.views.textinput.ContentSizeWatcher; -import com.facebook.react.views.textinput.ReactTextChangedEvent; import com.facebook.react.views.textinput.ReactTextInputLocalData; import com.facebook.react.views.textinput.ScrollWatcher; @@ -35,7 +34,6 @@ import java.util.LinkedList; import java.util.Set; import java.util.HashSet; -import java.util.Map; import java.util.HashMap; import static android.content.ClipData.*; @@ -66,6 +64,11 @@ public class ReactAztecText extends AztecText { boolean shouldHandleOnSelectionChange = false; boolean shouldHandleActiveFormatsChange = false; + // This optional variable holds the outer HTML tag that will be added to the text when the user start typing in it + // This is required to keep placeholder text working, and start typing with styled text. + // Ref: https://github.com/wordpress-mobile/gutenberg-mobile/issues/707 + private String mTagName = ""; + private static final HashMap typingFormatsMap = new HashMap() { { put(AztecTextFormat.FORMAT_BOLD, "bold"); @@ -241,6 +244,14 @@ public void run() { setIntrinsicContentSize(); } + public void setTagName(@Nullable String tagName) { + this.mTagName = tagName; + } + + public String getTagName() { + return this.mTagName; + } + private void updateToolbarButtons(int selStart, int selEnd) { ArrayList appliedStyles = getAppliedStyles(selStart, selEnd); updateToolbarButtons(appliedStyles); diff --git a/src/_variables.android.scss b/src/_variables.android.scss index 9ddfdf515b..cf25c8c94a 100644 --- a/src/_variables.android.scss +++ b/src/_variables.android.scss @@ -8,4 +8,4 @@ $title-block-padding-bottom: 0; $min-height-title: 53; $min-height-paragraph: 50; -$min-height-heading: 50; +$min-height-heading: 60;