@wordpress/components/build-module/mobile/picker/index.android.js

UI components for WordPress.

import { createElement } from "@wordpress/element";

/**
 * External dependencies
 */
import { View } from 'react-native';
/**
 * WordPress dependencies
 */

import { __ } from '@wordpress/i18n';
import { Component } from '@wordpress/element';
import { usePreferredColorSchemeStyle } from '@wordpress/compose';
import { PanelBody, TextControl } from '@wordpress/components';
/**
 * Internal dependencies
 */

import BottomSheet from '../bottom-sheet';
import styles from './styles.scss';

function Separator() {
  const separatorStyle = usePreferredColorSchemeStyle(styles.separator, styles.separatorDark);
  return createElement(View, {
    style: separatorStyle
  });
}

export default class Picker extends Component {
  constructor() {
    super(...arguments);
    this.onClose = this.onClose.bind(this);
    this.onCellPress = this.onCellPress.bind(this);
    this.state = {
      isVisible: false
    };
  }

  presentPicker() {
    this.setState({
      isVisible: true
    });
  }

  onClose() {
    this.setState({
      isVisible: false
    });
  }

  onCellPress(value) {
    const {
      onChange
    } = this.props;
    onChange(value);
    this.onClose();
  }

  getOptions() {
    const {
      options,
      leftAlign
    } = this.props;
    return options.map(option => createElement(View, {
      key: `${option.label}-${option.value}`
    }, options.length > 1 && option.separated && createElement(Separator, null), createElement(BottomSheet.Cell, {
      icon: option.icon,
      leftAlign: leftAlign,
      label: option.label,
      separatorType: 'none',
      onPress: () => this.onCellPress(option.value),
      disabled: option.disabled,
      style: option.disabled && styles.disabled
    })));
  }

  render() {
    const {
      hideCancelButton,
      title
    } = this.props;
    const {
      isVisible
    } = this.state;
    return createElement(BottomSheet, {
      isVisible: isVisible,
      onClose: this.onClose,
      style: {
        paddingBottom: 20
      },
      hideHeader: true
    }, createElement(PanelBody, {
      title: title,
      style: styles.panelBody
    }, this.getOptions(), !hideCancelButton && createElement(TextControl, {
      label: __('Cancel'),
      onPress: this.onClose,
      separatorType: 'none'
    })));
  }

}
//# sourceMappingURL=index.android.js.map