text: /**
   * Copyright (c) Facebook, Inc. and its affiliates.
   *
   * This source code is licensed under the MIT license found in the
   * LICENSE file in the root directory of this source tree.
   *
   * @format
   * @flow
   */
  
  'use strict';
  
  const React = require('React');
  const UIManager = require('UIManager');
  
  const requireNativeComponent = require('requireNativeComponent');
  const resolveAssetSource = require('resolveAssetSource');
  
  import type {SyntheticEvent} from 'CoreEventTypes';
  import type {ImageSource} from 'ImageSource';
  import type {ColorValue} from 'StyleSheetTypes';
  import type {ViewProps} from 'ViewPropTypes';
  import type {NativeComponent} from 'ReactNative';
  
  /**
   * React component that wraps the Android-only [`Toolbar` widget][0]. A Toolbar can display a logo,
   * navigation icon (e.g. hamburger menu), a title & subtitle and a list of actions. The title and
   * subtitle are expanded so the logo and navigation icons are displayed on the left, title and
   * subtitle in the middle and the actions on the right.
   *
   * If the toolbar has an only child, it will be displayed between the title and actions.
   *
   * Although the Toolbar supports remote images for the logo, navigation and action icons, this
   * should only be used in DEV mode where `require('./some_icon.png')` translates into a packager
   * URL. In release mode you should always use a drawable resource for these icons. Using
   * `require('./some_icon.png')` will do this automatically for you, so as long as you don't
   * explicitly use e.g. `{uri: 'http://...'}`, you will be good.
   *
   * Example:
   *
   * ```
   * render: function() {
   *   return (
   *     <ToolbarAndroid
   *       logo={require('./app_logo.png')}
   *       title="AwesomeApp"
   *       actions={[{title: 'Settings', icon: require('./icon_settings.png'), show: 'always'}]}
   *       onActionSelected={this.onActionSelected} />
   *   )
   * },
   * onActionSelected: function(position) {
   *   if (position === 0) { // index of 'Settings'
   *     showSettings();
   *   }
   * }
   * ```
   *
   * [0]: https://developer.android.com/reference/android/support/v7/widget/Toolbar.html
   */
  
  const NativeToolbar = requireNativeComponent('ToolbarAndroid');
  
  type Action = $ReadOnly<{|
    title: string,
    icon?: ?ImageSource,
    show?: 'always' | 'ifRoom' | 'never',
    showWithText?: boolean,
  |}>;
  
  type ToolbarAndroidChangeEvent = SyntheticEvent<
    $ReadOnly<{|
      position: number,
    |}>,
  >;
  
  type ToolbarAndroidProps = $ReadOnly<{|
    ...ViewProps,
    /**
     * or text on the right side of the widget. If they don't fit they are placed in an 'overflow'
     * Sets possible actions on the toolbar as part of the action menu. These are displayed as icons
     * menu.
     *
     * This property takes an array of objects, where each object has the following keys:
     *
     * * `title`: **required**, the title of this action
     * * `icon`: the icon for this action, e.g. `require('./some_icon.png')`
     * * `show`: when to show this action as an icon or hide it in the overflow menu: `always`,
     * `ifRoom` or `never`
     * * `showWithText`: boolean, whether to show text alongside the icon or not
     */
    actions?: ?Array<Action>,
    /**
     * Sets the toolbar logo.
     */
    logo?: ?ImageSource,
    /**
     * Sets the navigation icon.
     */
    navIcon?: ?ImageSource,
    /**
     * Callback that is called when an action is selected. The only argument that is passed to the
     * callback is the position of the action in the actions array.
     */
    onActionSelected?: ?(position: number) => void,
    /**
     * Callback called when the icon is selected.
     */
    onIconClicked?: ?() => void,
    /**
     * Sets the overflow icon.
     */
    overflowIcon?: ?ImageSource,
    /**
     * Sets the toolbar subtitle.
     */
    subtitle?: ?string,
    /**
     * Sets the toolbar subtitle color.
     */
    subtitleColor?: ?ColorValue,
    /**
     * Sets the toolbar title.
     */
    title?: ?Stringish,
    /**
     * Sets the toolbar title color.
     */
    titleColor?: ?ColorValue,
    /**
     * Sets the content inset for the toolbar starting edge.
     *
     * The content inset affects the valid area for Toolbar content other than
     * the navigation button and menu. Insets define the minimum margin for
     * these components and can be used to effectively align Toolbar content
     * along well-known gridlines.
     */
    contentInsetStart?: ?number,
    /**
     * Sets the content inset for the toolbar ending edge.
     *
     * The content inset affects the valid area for Toolbar content other than
     * the navigation button and menu. Insets define the minimum margin for
     * these components and can be used to effectively align Toolbar content
     * along well-known gridlines.
     */
    contentInsetEnd?: ?number,
    /**
     * Used to set the toolbar direction to RTL.
     * In addition to this property you need to add
     *
     *   android:supportsRtl="true"
     *
     * to your application AndroidManifest.xml and then call
     * `setLayoutDirection(LayoutDirection.RTL)` in your MainActivity
     * `onCreate` method.
     */
    rtl?: ?boolean,
    /**
     * Used to locate this view in end-to-end tests.
     */
    testID?: ?string,
  |}>;
  
  type Props = $ReadOnly<{|
    ...ToolbarAndroidProps,
    forwardedRef: ?React.Ref<typeof NativeToolbar>,
  |}>;
  
  class ToolbarAndroid extends React.Component<Props> {
    _onSelect = (event: ToolbarAndroidChangeEvent) => {
      const position = event.nativeEvent.position;
      if (position === -1) {
        this.props.onIconClicked && this.props.onIconClicked();
      } else {
        this.props.onActionSelected && this.props.onActionSelected(position);
      }
    };
  
    render() {
      const {
        onIconClicked,
        onActionSelected,
        forwardedRef,
        ...otherProps
      } = this.props;
  
      const nativeProps: {...typeof otherProps, nativeActions?: Array<Action>} = {
        ...otherProps,
      };
  
      if (this.props.logo) {
        nativeProps.logo = resolveAssetSource(this.props.logo);
      }
  
      if (this.props.navIcon) {
        nativeProps.navIcon = resolveAssetSource(this.props.navIcon);
      }
  
      if (this.props.overflowIcon) {
        nativeProps.overflowIcon = resolveAssetSource(this.props.overflowIcon);
      }
  
      if (this.props.actions) {
        const nativeActions = [];
        for (let i = 0; i < this.props.actions.length; i++) {
          const action = {
            icon: this.props.actions[i].icon,
            show: this.props.actions[i].show,
          };
  
          if (action.icon) {
            action.icon = resolveAssetSource(action.icon);
          }
          if (action.show) {
            action.show = UIManager.getViewManagerConfig(
              'ToolbarAndroid',
            ).Constants.ShowAsAction[action.show];
          }
  
          nativeActions.push({
            ...this.props.actions[i],
            ...action,
          });
        }
  
        nativeProps.nativeActions = nativeActions;
      }
  
      return (
        <NativeToolbar
          onSelect={this._onSelect}
          {...nativeProps}
          ref={forwardedRef}
        />
      );
    }
  }
  
  const ToolbarAndroidToExport = React.forwardRef(
    (
      props: ToolbarAndroidProps,
      forwardedRef: ?React.Ref<typeof NativeToolbar>,
    ) => {
      return <ToolbarAndroid {...props} forwardedRef={forwardedRef} />;
    },
  );
  
  /* $FlowFixMe(>=0.89.0 site=react_native_android_fb) This comment suppresses an
   * error found when Flow v0.89 was deployed. To see the error, delete this
   * comment and run Flow. */
  module.exports = (ToolbarAndroidToExport: Class<
    NativeComponent<ToolbarAndroidProps>,
  >);
  