"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactNative = require("react-native");
var _i18n = require("@wordpress/i18n");
var _element = require("@wordpress/element");
var _compose = require("@wordpress/compose");
var _bottomSheet = _interopRequireDefault(require("../bottom-sheet"));
var _styles = _interopRequireDefault(require("./styles.scss"));
var _body = _interopRequireDefault(require("../../panel/body"));
var _textControl = _interopRequireDefault(require("../../text-control"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

function Separator() {
  const separatorStyle = (0, _compose.usePreferredColorSchemeStyle)(_styles.default['components-picker__separator'], _styles.default['components-picker__separator--dark']);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
    style: separatorStyle
  });
}
class Picker extends _element.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 => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_element.Fragment, {
      children: [options.length > 1 && option.separated && /*#__PURE__*/(0, _jsxRuntime.jsx)(Separator, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default.Cell, {
        icon: option.icon,
        leftAlign: leftAlign,
        label: option.label,
        separatorType: "none",
        onPress: () => this.onCellPress(option.value),
        disabled: option.disabled,
        style: option.disabled && _styles.default['components-picker__button--disabled']
      })]
    }, `${option.label}-${option.value}`));
  }
  render() {
    const {
      hideCancelButton,
      title,
      testID
    } = this.props;
    const {
      isVisible
    } = this.state;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default, {
      isVisible: isVisible,
      onClose: this.onClose,
      hideHeader: true,
      testID: testID,
      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_body.default, {
        title: title,
        style: _styles.default['components-picker__panel'],
        children: [this.getOptions(), !hideCancelButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_textControl.default, {
          label: (0, _i18n.__)('Cancel'),
          onPress: this.onClose,
          separatorType: "none"
        })]
      })
    });
  }
}
exports.default = Picker;
//# sourceMappingURL=index.android.js.map