var _excluded = ["portal", "list", "show", "value", "selected", "maskAttribute", "submitAttribute", "cancelAttribute", "slotAttribute"],
    _excluded2 = ["caption", "onClick"];

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _createForOfIteratorHelperLoose(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (it) return (it = it.call(o)).next.bind(it); if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React, { forwardRef, useRef, useImperativeHandle, useEffect, useContext } from 'react';
import { createPortal } from 'react-dom';
import Instance from './instance.js';
import Context from '../Context/instance.js';
var Picker = forwardRef(function (_ref, ref) {
  var portal = _ref.portal,
      _ref$list = _ref.list,
      list = _ref$list === void 0 ? [] : _ref$list,
      _ref$show = _ref.show,
      show = _ref$show === void 0 ? false : _ref$show,
      value = _ref.value,
      selected = _ref.selected,
      _ref$maskAttribute = _ref.maskAttribute,
      maskAttribute = _ref$maskAttribute === void 0 ? {} : _ref$maskAttribute,
      _ref$submitAttribute = _ref.submitAttribute,
      submitAttribute = _ref$submitAttribute === void 0 ? {} : _ref$submitAttribute,
      _ref$cancelAttribute = _ref.cancelAttribute,
      cancelAttribute = _ref$cancelAttribute === void 0 ? {} : _ref$cancelAttribute,
      _ref$slotAttribute = _ref.slotAttribute,
      slotAttribute = _ref$slotAttribute === void 0 ? {} : _ref$slotAttribute,
      others = _objectWithoutPropertiesLoose(_ref, _excluded);

  var rootRef = useRef(null);
  useImperativeHandle(ref, function () {
    return rootRef.current;
  });
  var instance = useRef(null);
  useEffect(function () {
    initInstance();
  }, []); // eslint-disable-line

  useEffect(function () {
    if (instance.current) {
      if (show && list.length) {
        setDefault();
        instance.current.show();
      } else {
        instance.current.hide();
      }
    } else if (list && list.length > 0) {
      initInstance();
    }
  }, [show]); // eslint-disable-line
  // 更新句柄, 防止synchronization模式, 每次组件在render的时候都生成上次render的state、function、effects

  if (instance.current) {
    instance.current.params.onClickSubmit = clickSubmit;
    instance.current.params.onClickCancel = clickCancel;
    instance.current.params.onClickMask = clickMask;
  }

  function clickSubmit(e) {
    var value = e.activeOptions[0].name;
    var options = e.activeOptions;
    if (submitAttribute.onClick) submitAttribute.onClick(e, value, options);
  }

  function clickCancel(e) {
    if (cancelAttribute.onClick) cancelAttribute.onClick(e);
  }

  function clickMask(e) {
    if (maskAttribute.onClick) maskAttribute.onClick(e);
  }

  function setDefault() {
    var defaultOpt = getDefaultOption();
    if (!defaultOpt) return;
    instance.current.clearSlots();
    instance.current.addSlot(list, defaultOpt.id || '', slotAttribute.className || 'text-center'); // 添加列,参数:数据,默认id,样式(lock样式为锁定列)
  }

  function getDefaultOption() {
    if (selected && selected.length) {
      return selected[0];
    }

    if (value) {
      for (var _iterator = _createForOfIteratorHelperLoose(list), _step; !(_step = _iterator()).done;) {
        var item = _step.value;
        if (item.name === value) return item;
      }
    }

    if (list && list.length) {
      return list[0];
    }

    return null;
  }

  function initInstance() {
    if (!list || !list.length || instance.current) {
      console.log('SeedsUI Picker: 参数list为空');
      return;
    } // render数据


    instance.current = new Instance({
      mask: rootRef.current,
      onClickMask: clickMask,
      onClickCancel: clickCancel,
      onClickSubmit: clickSubmit,
      onHid: function onHid(e) {}
    }); // 默认项

    var defaultOpt = getDefaultOption();
    var id = '';
    if (defaultOpt && defaultOpt.id) id = defaultOpt.id;
    instance.current.addSlot(list, id, slotAttribute.className || 'text-center');

    if (show && instance.current) {
      instance.current.show();
    }

    rootRef.current.instance = instance;
  } // 过滤已经回调的属性


  function filterProps(props) {
    if (!props) return {};

    var caption = props.caption,
        onClick = props.onClick,
        otherProps = _objectWithoutPropertiesLoose(props, _excluded2);

    return _extends({}, otherProps);
  } // context


  var context = useContext(Context) || {};

  var locale = context.locale || function (remark) {
    return remark || '';
  }; // 剔除掉onClick事件, 因为在instance时已经回调了


  var otherMaskAttribute = filterProps(maskAttribute);
  var otherSubmitAttribute = filterProps(submitAttribute);
  var otherCancelAttribute = filterProps(cancelAttribute);
  return createPortal( /*#__PURE__*/React.createElement("div", _extends({
    ref: rootRef
  }, otherMaskAttribute, {
    className: "mask picker-mask" + (otherMaskAttribute.className ? ' ' + otherMaskAttribute.className : '')
  }), /*#__PURE__*/React.createElement("div", _extends({}, others, {
    className: "picker" + (others.className ? ' ' + others.className : '')
  }), /*#__PURE__*/React.createElement("div", {
    className: "picker-header"
  }, /*#__PURE__*/React.createElement("a", _extends({}, otherCancelAttribute, {
    className: "picker-cancel" + (cancelAttribute.className ? ' ' + cancelAttribute.className : '')
  }), cancelAttribute.caption || locale('取消', 'cancel')), /*#__PURE__*/React.createElement("div", {
    className: "picker-header-title"
  }), /*#__PURE__*/React.createElement("a", _extends({}, otherSubmitAttribute, {
    className: "picker-submit" + (submitAttribute.className ? ' ' + submitAttribute.className : '')
  }), submitAttribute.caption || locale('完成', 'finish'))), /*#__PURE__*/React.createElement("div", {
    className: "picker-wrapper"
  }, /*#__PURE__*/React.createElement("div", {
    className: "picker-layer"
  }, /*#__PURE__*/React.createElement("div", {
    className: "picker-layer-frame"
  })), /*#__PURE__*/React.createElement("div", {
    className: "picker-slotbox"
  })))), portal || context.portal || document.getElementById('root') || document.body);
});
export default React.memo(Picker, function (prevProps, nextProps) {
  if (nextProps.show === prevProps.show) return true;
  return false;
});