import React, { useMemo } from 'react';
import "./Presets.less";
var Presets = function Presets(props) {
  var presets = props.presets,
    onChange = props.onChange;
  var handleItemClick = function handleItemClick(item) {
    if (item.onClick) {
      var _next2 = function _next2() {
        return onChange("".concat(item.value));
      };
      item.onClick(item, _next2);
    } else {
      onChange("".concat(item.value));
    }
  };
  return useMemo(function () {
    if (!(presets !== null && presets !== void 0 && presets.length)) {
      return null;
    }
    return /*#__PURE__*/React.createElement("div", {
      className: "pisell-virtual-keyboard-preset"
    }, presets.map(function (item, index) {
      var _item$render;
      var itemProps = {
        key: index,
        className: 'pisell-virtual-keyboard-preset-item',
        style: item.style,
        onClick: function onClick() {
          return handleItemClick(item);
        }
      };
      return /*#__PURE__*/React.createElement("div", itemProps, ((_item$render = item.render) === null || _item$render === void 0 ? void 0 : _item$render.call(item, item)) || item.label);
    }));
  }, [presets, onChange]);
};
export default Presets;