Merge branch 'master' into v7

guyca · web-flow · commit 58f150864429 · 2020-08-02T12:50:35.000+03:00
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/StackPresenter.java b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/StackPresenter.java
@@ -317,7 +317,7 @@ private List<ButtonController> getOrCreateButtonControllers(@Nullable Map<String
 
     private ButtonController createButtonController(ButtonOptions button) {
         ButtonController controller = new ButtonController(activity,
-                new ButtonPresenter(button, iconResolver),
+                new ButtonPresenter(activity, button, iconResolver),
                 button,
                 buttonCreator,
                 onClickListener
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/topbar/button/ButtonPresenter.kt b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/topbar/button/ButtonPresenter.kt
@@ -1,5 +1,6 @@
 package com.reactnativenavigation.viewcontrollers.stack.topbar.button
 
+import android.content.Context
 import android.graphics.Color
 import android.graphics.PorterDuff
 import android.graphics.PorterDuffColorFilter
@@ -18,15 +19,15 @@ import com.reactnativenavigation.options.ButtonOptions
 import com.reactnativenavigation.utils.*
 import com.reactnativenavigation.views.stack.topbar.titlebar.TitleBar
 
-open class ButtonPresenter(private val button: ButtonOptions, private val iconResolver: IconResolver) {
+open class ButtonPresenter(private val context: Context, private val button: ButtonOptions, private val iconResolver: IconResolver) {
     companion object {
         const val DISABLED_COLOR = Color.LTGRAY
     }
 
     val styledText: SpannableString
         get() {
             return SpannableString(button.text.get("")).apply {
-                setSpan(ButtonSpan(button), 0, button.text.length(), Spanned.SPAN_EXCLUSIVE_INCLUSIVE)
+                setSpan(ButtonSpan(context, button), 0, button.text.length(), Spanned.SPAN_EXCLUSIVE_INCLUSIVE)
             }
         }
 
diff --git a/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/topbar/button/ButtonSpan.kt b/lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/stack/topbar/button/ButtonSpan.kt
@@ -1,13 +1,15 @@
 package com.reactnativenavigation.viewcontrollers.stack.topbar.button
 
+import android.content.Context
 import android.graphics.Color
 import android.graphics.Paint
 import android.graphics.Typeface
 import android.text.TextPaint
 import android.text.style.MetricAffectingSpan
 import com.reactnativenavigation.options.ButtonOptions
+import com.reactnativenavigation.utils.UiUtils
 
-class ButtonSpan(private val button: ButtonOptions) : MetricAffectingSpan() {
+class ButtonSpan(private val context: Context, private val button: ButtonOptions) : MetricAffectingSpan() {
     override fun updateDrawState(drawState: TextPaint) = apply(drawState)
 
     override fun updateMeasureState(paint: TextPaint) = apply(paint)
@@ -17,7 +19,7 @@ class ButtonSpan(private val button: ButtonOptions) : MetricAffectingSpan() {
             val fakeStyle = (paint.typeface?.style ?: 0) and (fontFamily?.style?.inv() ?: 1)
             if (fakeStyle and Typeface.BOLD != 0) paint.isFakeBoldText = true
             if (fakeStyle and Typeface.ITALIC != 0) paint.textSkewX = -0.25f
-            if (fontSize.hasValue()) paint.textSize = fontSize.get().toFloat()
+            if (fontSize.hasValue()) paint.textSize = UiUtils.dpToPx(context, fontSize.get().toFloat())
             paint.typeface = fontFamily
         }
     }
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/utils/ButtonPresenterTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/utils/ButtonPresenterTest.java
@@ -43,7 +43,7 @@ public void beforeEach() {
         activity.setContentView(titleBar);
         button = createButton();
 
-        uut = new ButtonPresenter(button, new IconResolverFake(activity));
+        uut = new ButtonPresenter(activity, button, new IconResolverFake(activity));
         buttonController = new ButtonController(
                 activity,
                 uut,
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/utils/ButtonSpanTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/utils/ButtonSpanTest.java
@@ -1,26 +1,32 @@
 package com.reactnativenavigation.utils;
 
+import android.app.Activity;
 import android.graphics.Color;
 import android.graphics.Paint;
 
 import com.reactnativenavigation.BaseTest;
 import com.reactnativenavigation.options.ButtonOptions;
 import com.reactnativenavigation.options.params.Colour;
+import com.reactnativenavigation.options.params.Fraction;
 import com.reactnativenavigation.viewcontrollers.stack.topbar.button.ButtonSpan;
 
 import org.jetbrains.annotations.NotNull;
 import org.junit.Test;
+import org.robolectric.annotation.Config;
 
 import static org.assertj.core.api.Java6Assertions.assertThat;
 
+@Config(qualifiers = "xhdpi")
 public class ButtonSpanTest extends BaseTest {
     private ButtonSpan uut;
     private ButtonOptions button;
+    private Activity activity;
 
     @Override
     public void beforeEach() {
         button = createButton();
-        uut = new ButtonSpan(button);
+        activity = newActivity();
+        uut = new ButtonSpan(activity, button);
     }
 
     @Test
@@ -31,6 +37,15 @@ public void apply_colorIsNotHandled() {
         assertThat(paint.getColor()).isNotEqualTo(button.color.get());
     }
 
+    @Test
+    public void apply_fontSizeIsAppliedInDp() {
+        button.fontSize = new Fraction(14);
+        Paint paint = new Paint();
+        uut.apply(paint);
+
+        assertThat(paint.getTextSize()).isEqualTo(UiUtils.dpToPx(activity, 14));
+    }
+
     @NotNull
     private ButtonOptions createButton() {
         ButtonOptions button = new ButtonOptions();
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java b/lib/android/app/src/test/java/com/reactnativenavigation/utils/TitleBarHelper.java
@@ -45,7 +45,7 @@ public static ButtonOptions iconButton(String id, String icon) {
 
     public static ButtonController createButtonController(Activity activity, ButtonOptions button) {
         return new ButtonController(activity,
-                new ButtonPresenter(button, new IconResolver(activity, ImageLoaderMock.mock())),
+                new ButtonPresenter(activity, button, new IconResolver(activity, ImageLoaderMock.mock())),
                 button,
                 new TitleBarButtonCreatorMock(),
                 buttonId -> {}
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TitleBarButtonControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TitleBarButtonControllerTest.java
@@ -30,7 +30,7 @@ public void beforeEach() {
         ButtonOptions button = createComponentButton();
         uut = new ButtonController(
                 activity,
-                new ButtonPresenter(button, new IconResolver(activity, ImageLoaderMock.mock())),
+                new ButtonPresenter(activity, button, new IconResolver(activity, ImageLoaderMock.mock())),
                 button,
                 new TitleBarButtonCreatorMock(),
                 Mockito.mock(ButtonController.OnClickListener.class)
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TitleBarTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TitleBarTest.java
@@ -123,7 +123,7 @@ public void setTitleFontSize_usesDpInsteadofSp() {
     private ButtonController createButtonController(ButtonOptions b) {
         return new ButtonController(
                 activity,
-                new ButtonPresenter(b, new IconResolverFake(activity)),
+                new ButtonPresenter(activity, b, new IconResolverFake(activity)),
                 b,
                 mock(TitleBarButtonCreator.class),
                 mock(ButtonController.OnClickListener.class)
diff --git a/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TopBarButtonControllerTest.java b/lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/stack/TopBarButtonControllerTest.java
@@ -47,7 +47,7 @@ public void beforeEach() {
         stackController.getTopBar().layout(0, 0, 1080, 200);
         getTitleBar().layout(0, 0, 1080, 200);
 
-        optionsPresenter = spy(new ButtonPresenter(button, new IconResolverFake(activity)));
+        optionsPresenter = spy(new ButtonPresenter(activity, button, new IconResolverFake(activity)));
         uut = new ButtonController(activity, optionsPresenter, button, buttonCreatorMock, (buttonId) -> {});
 
         stackController.ensureViewIsCreated();
diff --git a/lib/src/commands/LayoutTreeCrawler.test.ts b/lib/src/commands/LayoutTreeCrawler.test.ts
@@ -155,4 +155,57 @@ describe('LayoutTreeCrawler', () => {
     uut.crawl(node, CommandName.SetRoot);
     expect(node.data.passProps).toBeUndefined();
   });
+
+  it('componentId is included in props passed to options generator', () => {
+    let componentIdInProps: String = '';
+
+    when(mockedStore.getComponentClassForName('theComponentName')).thenReturn(
+      () =>
+        class extends React.Component {
+          static options(props: any) {
+            componentIdInProps = props.componentId;
+            return {};
+          }
+        }
+    );
+    const node = {
+      id: 'testId',
+      type: LayoutType.Component,
+      data: {
+        name: 'theComponentName',
+        passProps: { someProp: 'here' },
+      },
+      children: [],
+    };
+    uut.crawl(node, CommandName.SetRoot);
+    expect(componentIdInProps).toEqual('testId');
+  });
+
+  it('componentId does not override componentId in passProps', () => {
+    let componentIdInProps: String = '';
+
+    when(mockedStore.getComponentClassForName('theComponentName')).thenReturn(
+      () =>
+        class extends React.Component {
+          static options(props: any) {
+            componentIdInProps = props.componentId;
+            return {};
+          }
+        }
+    );
+    const node = {
+      id: 'testId',
+      type: LayoutType.Component,
+      data: {
+        name: 'theComponentName',
+        passProps: {
+          someProp: 'here',
+          componentId: 'compIdFromPassProps',
+        },
+      },
+      children: [],
+    };
+    uut.crawl(node, CommandName.SetRoot);
+    expect(componentIdInProps).toEqual('compIdFromPassProps');
+  });
 });
diff --git a/lib/src/commands/LayoutTreeCrawler.ts b/lib/src/commands/LayoutTreeCrawler.ts
@@ -57,7 +57,7 @@ export class LayoutTreeCrawler {
     const reactComponent = foundReactGenerator ? foundReactGenerator() : undefined;
     if (reactComponent && this.isComponentWithOptions(reactComponent)) {
       return isFunction(reactComponent.options)
-        ? reactComponent.options(node.data.passProps || {})
+        ? reactComponent.options({ componentId: node.id, ...node.data.passProps } || {})
         : reactComponent.options;
     }
     return {};
diff --git a/lib/src/interfaces/NavigationComponent.ts b/lib/src/interfaces/NavigationComponent.ts
@@ -16,7 +16,13 @@ export class NavigationComponent<Props = {}, State = {}, Snapshot = any> extends
   State,
   Snapshot
 > {
-  static options?: (() => Options) | Options;
+  /**
+   * Options used to apply a style configuration when the screen appears.
+   *
+   * This field can either contain the concrete options to be applied, or a generator function
+   * which accepts props and returns an Options object.
+   */
+  static options: ((props?: any) => Options) | Options;
 
   componentDidAppear(_event: ComponentDidAppearEvent) {}
   componentDidDisappear(_event: ComponentDidDisappearEvent) {}
diff --git a/lib/src/interfaces/Options.ts b/lib/src/interfaces/Options.ts
@@ -393,6 +393,10 @@ export interface OptionsTopBarButton {
    * #### (iOS specific)
    */
   fontWeight?: FontWeight;
+  /**
+   * Set the font size in dp
+   */
+  fontSize?: number;
   /**
    * Set the button enabled or disabled
    * @default true
diff --git a/package.json b/package.json
@@ -97,7 +97,7 @@
     "react-native-gesture-handler": "^1.6.1",
     "react-native-keyboard-tracking-view": "5.x.x",
     "react-native-reanimated": "^1.9.0",
-    "react-native-ui-lib": "5.x.x",
+    "react-native-ui-lib": "5.11.0",
     "react-redux": "5.x.x",
     "react-test-renderer": "16.13.1",
     "redux": "3.x.x",
diff --git a/playground/src/screens/ButtonsScreen.tsx b/playground/src/screens/ButtonsScreen.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { NavigationComponentProps } from 'react-native-navigation';
+import { NavigationComponent, Options } from 'react-native-navigation';
 import Root from '../components/Root';
 import Button from '../components/Button';
 import Navigation from '../services/Navigation';
@@ -18,8 +18,8 @@ const {
   CHANGE_BUTTON_PROPS,
 } = testIDs;
 
-export default class Options extends React.Component<NavigationComponentProps> {
-  static options() {
+export default class ButtonOptions extends NavigationComponent {
+  static options(): Options {
     return {
       fab: {
         id: 'fab',
diff --git a/website/api/api-options.mdx b/website/api/api-options.mdx
@@ -10,38 +10,38 @@ Set default options for all screens. Useful for declaring a consistent style acr
 
 #### Parameters
 
-| Name    | Type                    | Required | Description  |
-| ------- | ----------------------- | -------- | ------------ |
+| Name    | Type                        | Required | Description  |
+| ------- | --------------------------- | -------- | ------------ |
 | options | [Options](options-root.mdx) | Yes      | Options root |
 
 #### Example
 
 ```js
 Navigation.setDefaultOptions({
   bottomTab: {
-    textColor: "black",
-    selectedTextColor: "blue"
-  }
+    textColor: 'black',
+    selectedTextColor: 'blue',
+  },
 });
 ```
 
 ## `mergeOptions`
 
-Change navigation options of a component.
+Change navigation options of a component or layout.
 
 #### Parameters
 
-| Name        | Type                    | Required | Description      |
-| ----------- | ----------------------- | -------- | ---------------- |
-| componentId | string                  | Yes      | The component id |
-| options     | [Options](options-root.mdx) | Yes      | Options root     |
+| Name        | Type                        | Required | Description                |
+| ----------- | --------------------------- | -------- | -------------------------- |
+| componentId | string                      | Yes      | The component or layout id |
+| options     | [Options](options-root.mdx) | Yes      | Options root               |
 
 #### Example
 
 ```js
 Navigation.mergeOptions('componentId', {
   bottomTabs: {
-    visible: false
-  }
+    visible: false,
+  },
 });
 ```
diff --git a/website/api/options-button.mdx b/website/api/options-button.mdx
@@ -25,6 +25,14 @@ This option will set whether characters are all capitalized or not.
 | ------- | -------- | -------- | ------- |
 | boolean | No       | Android  | true    |
 
+### `fontSize`
+
+If the button has text, this option is used to set font size in DP.
+
+| Type   | Required | Platform |
+| ------ | -------- | -------- |
+| number | No       | Both     |
+
 ### `id`
 
 Buttons are identified by their id property. When a button is clicked, a buttonPress event is emitted to js, containing the id of the clicked button.
diff --git a/website/docs/style-screens.mdx b/website/docs/style-screens.mdx
diff --git a/website/sidebars.js b/website/sidebars.js
