"use strict";

var __assign = void 0 && (void 0).__assign || function () {
  __assign = Object.assign || function (t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];

      for (var p in s) {
        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
      }
    }

    return t;
  };

  return __assign.apply(this, arguments);
};

var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
  if (k2 === undefined) k2 = k;
  Object.defineProperty(o, k2, {
    enumerable: true,
    get: function get() {
      return m[k];
    }
  });
} : function (o, m, k, k2) {
  if (k2 === undefined) k2 = k;
  o[k2] = m[k];
});

var __setModuleDefault = void 0 && (void 0).__setModuleDefault || (Object.create ? function (o, v) {
  Object.defineProperty(o, "default", {
    enumerable: true,
    value: v
  });
} : function (o, v) {
  o["default"] = v;
});

var __importStar = void 0 && (void 0).__importStar || function (mod) {
  if (mod && mod.__esModule) return mod;
  var result = {};
  if (mod != null) for (var k in mod) {
    if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
  }

  __setModuleDefault(result, mod);

  return result;
};

var __rest = void 0 && (void 0).__rest || function (s, e) {
  var t = {};

  for (var p in s) {
    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  }

  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};

var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
  return mod && mod.__esModule ? mod : {
    "default": mod
  };
};

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CreateFilterMemo = exports.CreateFilter = void 0;

var jsx_runtime_1 = require("react/jsx-runtime");

var React = __importStar(require("react"));

var classnames_1 = __importDefault(require("classnames"));

var useClickAway_1 = __importDefault(require("react-use/lib/useClickAway"));

var button_1 = require("../button");

var draggable_wrap_1 = __importDefault(require("../draggable-wrap"));

var react_rnd_1 = require("react-rnd");

var tooltip_1 = __importDefault(require("../tooltip"));

var Icon_1 = __importDefault(require("../icon/Icon"));

require("./style/create-filter.css");

var prefixCls = 'dmc-create-filter';
var useState = React.useState,
    useCallback = React.useCallback,
    useMemo = React.useMemo,
    useRef = React.useRef,
    Fragment = React.Fragment,
    useEffect = React.useEffect;
var rndStyle = {
  right: 0,
  left: 'unset',
  pointerEvents: 'auto',
  transform: 'none'
};
var rndEnableResizing = {
  left: true
};
var fullStyle = {
  width: '100%',
  height: '100%'
};
exports.CreateFilter = React.forwardRef(function (props, ref) {
  var _a = props,
      onOk = _a.onOk,
      extra = _a.extra,
      children = _a.children,
      loading = _a.loading,
      overlay = _a.overlay,
      onClose = _a.onClose,
      className = _a.className,
      clickAway = _a.clickAway,
      showFooter = _a.showFooter,
      footerClassName = _a.footerClassName,
      okButtonLabel = _a.okButtonLabel,
      okButtonProps = _a.okButtonProps,
      cancelButtonLabel = _a.cancelButtonLabel,
      cancelButtonProps = _a.cancelButtonProps,
      _b = _a.overlayStyle,
      overlayStyle = _b === void 0 ? {} : _b,
      overlayClassName = _a.overlayClassName,
      getPopupContainer = _a.getPopupContainer,
      width = _a.width,
      height = _a.height,
      placement = _a.placement,
      otherContainerStyle = _a.otherContainerStyle,
      footerPrefixEl = _a.footerPrefixEl,
      leftResizable = _a.leftResizable,
      overlayMinWidth = _a.overlayMinWidth,
      onVisibleChange = _a.onVisibleChange,
      afterVisibleChange = _a.afterVisibleChange,
      onToggleVisible = _a.onToggleVisible,
      disabled = _a.disabled,
      restProps = __rest(_a, ["onOk", "extra", "children", "loading", "overlay", "onClose", "className", "clickAway", "showFooter", "footerClassName", "okButtonLabel", "okButtonProps", "cancelButtonLabel", "cancelButtonProps", "overlayStyle", "overlayClassName", "getPopupContainer", "width", "height", "placement", "otherContainerStyle", "footerPrefixEl", "leftResizable", "overlayMinWidth", "onVisibleChange", "afterVisibleChange", "onToggleVisible", "disabled"]);

  var refPicker = useRef(null);
  var refPopup = useRef(null);

  var _c = useState(false),
      popupVisible = _c[0],
      setPopupVisible = _c[1];

  var visibleRef = useRef(popupVisible);
  visibleRef.current = popupVisible;
  useEffect(function () {
    if (onVisibleChange) {
      onVisibleChange(popupVisible);
    }
  }, [popupVisible, onVisibleChange]);
  var toggleVisible = useCallback(function (e) {
    if (!disabled) {
      e.stopPropagation();
      var vi = !visibleRef.current;
      onToggleVisible && onToggleVisible(vi);
      setPopupVisible(vi);
    }
  }, [onToggleVisible, disabled]);
  var handleOk = useCallback(function (e) {
    toggleVisible(e);
    onOk && onOk();
  }, [onOk, toggleVisible]);
  var handleClose = useCallback(function (e) {
    toggleVisible(e);
    onClose && onClose();
  }, [onClose, toggleVisible]);
  var cancelBtn = useMemo(function () {
    return jsx_runtime_1.jsx(button_1.ButtonMemo, __assign({
      onClick: handleClose
    }, cancelButtonProps, {
      children: cancelButtonLabel
    }), void 0);
  }, [cancelButtonLabel, cancelButtonProps, handleClose]);
  var okBtn = useMemo(function () {
    return jsx_runtime_1.jsx(button_1.ButtonMemo, __assign({
      onClick: handleOk,
      type: "primary"
    }, okButtonProps, {
      children: okButtonLabel
    }), void 0);
  }, [handleOk, okButtonLabel, okButtonProps]);
  var renderFooter = useMemo(function () {
    return jsx_runtime_1.jsxs("div", __assign({
      className: classnames_1["default"](prefixCls + "-footer", footerClassName)
    }, {
      children: [!!extra && jsx_runtime_1.jsx("div", __assign({
        className: prefixCls + "-extra"
      }, {
        children: extra
      }), void 0), footerPrefixEl === null || footerPrefixEl === void 0 ? void 0 : footerPrefixEl(), jsx_runtime_1.jsxs("div", __assign({
        className: prefixCls + "-btns"
      }, {
        children: [cancelBtn, okBtn]
      }), void 0)]
    }), void 0);
  }, [footerClassName, extra, footerPrefixEl, cancelBtn, okBtn]);

  var _d = React.useState((overlayStyle === null || overlayStyle === void 0 ? void 0 : overlayStyle.width) || '100%'),
      overlayWidth = _d[0],
      setOverlayWidth = _d[1];

  var _f = React.useState(false),
      hideHandler = _f[0],
      setHideHandler = _f[1];

  var onResizeStart = React.useCallback(function () {
    setHideHandler(true);
  }, []);
  var onResizeStop = React.useCallback(function (_e, _dir, eleRef) {
    var w = eleRef.offsetWidth;

    if (overlayMinWidth && w < overlayMinWidth) {
      setOverlayWidth(overlayMinWidth);
    } else {
      setOverlayWidth(w);
    }

    setHideHandler(false);
  }, [overlayMinWidth]);
  var wrapperStyle = React.useMemo(function () {
    return __assign(__assign({}, overlayStyle), {
      width: overlayWidth
    });
  }, [overlayStyle, overlayWidth]);
  var rndSize = React.useMemo(function () {
    return {
      width: overlayWidth,
      height: (overlayStyle === null || overlayStyle === void 0 ? void 0 : overlayStyle.height) || '100%'
    };
  }, [overlayStyle, overlayWidth]);
  var renderToolTip = useMemo(function () {
    var _a;

    var wrapCls = classnames_1["default"]("" + prefixCls, className, (_a = {}, _a[prefixCls + "-loading"] = loading, _a));
    return jsx_runtime_1.jsx("div", __assign({
      ref: refPopup
    }, {
      children: jsx_runtime_1.jsx(draggable_wrap_1["default"], __assign({
        bounds: false,
        hideHandler: hideHandler
      }, {
        children: leftResizable ? jsx_runtime_1.jsx("div", __assign({
          style: wrapperStyle
        }, {
          children: jsx_runtime_1.jsx(react_rnd_1.Rnd, __assign({
            style: rndStyle,
            size: rndSize,
            dragAxis: "none",
            disableDragging: true,
            enableResizing: rndEnableResizing,
            onResizeStart: onResizeStart,
            onResizeStop: onResizeStop
          }, {
            children: jsx_runtime_1.jsx("div", __assign({
              style: fullStyle,
              className: wrapCls
            }, {
              children: loading ? jsx_runtime_1.jsx(Icon_1["default"], {
                icon: "loading",
                className: prefixCls + "-icon-loading"
              }, void 0) : jsx_runtime_1.jsxs(Fragment, {
                children: [jsx_runtime_1.jsx("div", __assign({
                  className: prefixCls + "-content"
                }, {
                  children: typeof overlay === 'function' ? overlay() : overlay
                }), void 0), showFooter && renderFooter]
              }, void 0)
            }), void 0)
          }), void 0)
        }), void 0) : // <div style={overlayStyle} className={wrapCls}>
        jsx_runtime_1.jsx("div", __assign({
          style: overlayStyle,
          className: wrapCls
        }, {
          children: loading ? jsx_runtime_1.jsx(Icon_1["default"], {
            icon: "loading",
            className: prefixCls + "-icon-loading"
          }, void 0) : jsx_runtime_1.jsxs(Fragment, {
            children: [jsx_runtime_1.jsx("div", __assign({
              className: prefixCls + "-content"
            }, {
              children: typeof overlay === 'function' ? overlay() : overlay
            }), void 0), showFooter && renderFooter]
          }, void 0)
        }), void 0)
      }), void 0)
    }), void 0);
  }, [className, loading, hideHandler, leftResizable, wrapperStyle, rndSize, onResizeStart, onResizeStop, overlay, showFooter, renderFooter, overlayStyle]);
  useClickAway_1["default"](refPicker, function (e) {
    if (clickAway) {
      var isPicker = !!(refPicker.current && refPicker.current.contains(e.target));
      var isPopup = !!(refPopup.current && refPopup.current.contains(e.target));
      var vi = isPicker || isPopup;

      if (vi !== popupVisible) {
        setPopupVisible(vi);
        onClose && onClose();
      }
    }
  });
  var popupCls = classnames_1["default"](prefixCls + "-popup", overlayClassName);
  var pickerStyle = React.useMemo(function () {
    return __assign({
      width: width,
      height: height
    }, otherContainerStyle);
  }, [height, otherContainerStyle, width]);
  return jsx_runtime_1.jsx(tooltip_1["default"], __assign({}, restProps, {
    ref: ref,
    arrowContent: null,
    trigger: "click",
    placement: placement,
    destroyTooltipOnHide: true,
    visible: popupVisible,
    overlayClassName: popupCls,
    overlay: renderToolTip,
    getPopupContainer: getPopupContainer,
    afterVisibleChange: afterVisibleChange
  }, {
    children: jsx_runtime_1.jsx("span", __assign({
      ref: refPicker,
      onClick: toggleVisible,
      style: pickerStyle
    }, {
      children: children
    }), void 0)
  }), void 0);
});
var defaultProps = {
  okButtonLabel: '确定',
  okButtonProps: {},
  cancelButtonLabel: '取消',
  cancelButtonProps: {},
  showFooter: true,
  placement: 'bottom'
};
exports.CreateFilter.defaultProps = defaultProps;
exports.CreateFilter.displayName = 'CreateFilter';
exports["default"] = exports.CreateFilter;
var CreateFilterMemo = React.memo(exports.CreateFilter);
exports.CreateFilterMemo = CreateFilterMemo;
CreateFilterMemo.displayName = 'CreateFilterMemo';

