/**
 * ldesign v0.2.14
 * (c) 2022/11/2 16:16 built by swimly
 * @license MIT
 */

import { h as helper } from '../../../chunks/helper.js';
import { defineComponent, ref } from '@vue/composition-api';
import { FilterIcon } from '@ldesign/icons-vue';
import isEmpty from 'lodash/isEmpty';
import lowerFirst from 'lodash/lowerFirst';
import '../../../chunks/index.js';
import { Popup } from '../../popup/index.js';
import { CheckboxGroup } from '../../checkbox/index.js';
import { RadioGroup } from '../../radio/index.js';
import { Input } from '../../input/index.js';
import { Button } from '../../button/index.js';
import { useLNodeDefault } from '../../../hooks/lnode.js';
import { useGlobalIcon } from '../../../hooks/use-global-icon.js';
import { useConfig } from '../../config-provider/useConfig.js';
import { l as log } from '../../../chunks/log.js';
import '../../../chunks/_commonjsHelpers.js';
import '../../../chunks/_commonjsHelpers-2e6815bd.js';
import '../../../utils/map-props.js';
import 'vue';
import '../../../utils/with-install.js';
import 'lodash';
import '../../../config.js';
import '../../popup/popup.js';
import '@popperjs/core';
import '../../../chunks/set-style.js';
import '../../../utils/dom.js';
import 'raf';
import 'lodash/isString';
import '../../../utils/easing.js';
import '../../../utils/render-node.js';
import '../../../utils/helper.js';
import 'lodash/camelCase';
import '../../config-provider/config-receiver.js';
import 'lodash/mergeWith';
import '../../config-provider/context.js';
import '../../../chunks/zh_CN.js';
import '../../config-provider/type.js';
import '../../../utils/mixins.js';
import '../../popup/props.js';
import '../../popup/container.js';
import '../../popup/style';
import '../../popup/type.js';
import '../../checkbox/group.js';
import 'lodash/intersection';
import '../../../utils/event.js';
import '../../checkbox/checkbox.js';
import '../../checkbox/props.js';
import '../../checkbox/style';
import '../../checkbox/type.js';
import '../../radio/radio.js';
import '../../radio/props.js';
import '../../radio/group.js';
import 'lodash/isNumber';
import '../../radio/radio-button.js';
import '../../radio/style';
import '../../radio/type.js';
import '../../input/input.js';
import 'lodash/kebabCase';
import '../../../chunks/helper2.js';
import '../../../chunks/defineProperty-838e4192.js';
import '../../input/props.js';
import '../../input/group.js';
import '../../input/style';
import '../../input/type.js';
import '../../button/button.js';
import '../../loading/index.js';
import '../../loading/loading.js';
import '../../../utils/transfer-dom.js';
import '../../loading/props.js';
import '../../loading/icon/gradient.js';
import '../../loading/style';
import '../../loading/type.js';
import '../../loading/plugin.js';
import '../../../utils/ripple.js';
import '../../button/props.js';
import '../../button/style';
import '../../button/type.js';
import 'lodash/isFunction';
import '../../../hooks/render-lnode.js';
import '../../../hooks/use-config.js';

var TableFilterController = defineComponent({
  name: "TableFilterController",
  props: {
    column: Object,
    tFilterValue: Object,
    innerFilterValue: Object,
    tableFilterClasses: Object,
    isFocusClass: String,
    primaryTableElement: {}
  },
  setup(props, _ref) {
    let {
      emit
    } = _ref;
    const triggerElementRef = ref(null);
    const renderLNode = useLNodeDefault();
    const {
      t,
      global
    } = useConfig("table");
    const {
      FilterIcon: FilterIcon$1
    } = useGlobalIcon({
      FilterIcon: FilterIcon
    });
    const filterPopupVisible = ref(false);
    const onFilterPopupVisibleChange = visible => {
      filterPopupVisible.value = visible;
      emit("visible-change", visible);
    };
    return {
      t,
      global,
      FilterIcon: FilterIcon$1,
      filterPopupVisible,
      triggerElementRef,
      renderLNode,
      onFilterPopupVisibleChange
    };
  },
  render(h) {
    var _this$tFilterValue;
    const getFilterContent = (h2, column2) => {
      var _column2$filter, _column2$filter2, _this$innerFilterValu;
      const types = ["single", "multiple", "input"];
      if (column2.type && !types.includes(column2.filter.type)) {
        log.error("Table", `filter.type must be the following: ${JSON.stringify(types)}`);
        return;
      }
      if (!column2.filter.type && !column2.filter.component) {
        log.error("Table", "both filter.type and filter.component can not be empty.");
        return;
      }
      const component = {
        single: RadioGroup,
        multiple: CheckboxGroup,
        input: Input
      }[column2.filter.type] || column2.filter.component;
      if (!component && !column2.filter.component) return;
      const filterComponentProps = {
        options: ["single", "multiple"].includes(column2.filter.type) ? (_column2$filter = column2.filter) === null || _column2$filter === void 0 ? void 0 : _column2$filter.list : void 0,
        ...(((_column2$filter2 = column2.filter) === null || _column2$filter2 === void 0 ? void 0 : _column2$filter2.props) || {}),
        value: (_this$innerFilterValu = this.innerFilterValue) === null || _this$innerFilterValu === void 0 ? void 0 : _this$innerFilterValu[column2.colKey]
      };
      if (column2.filter.type === "single") {
        filterComponentProps.onChange = val => {
          this.$emit("inner-filter-change", val, column2);
        };
      }
      const on = {
        change: val => {
          this.$emit("inner-filter-change", val, column2);
        }
      };
      if (column2.filter.confirmEvents) {
        column2.filter.confirmEvents.forEach(event => {
          const pureEvent = lowerFirst(event.replace("on", ""));
          on[pureEvent] = () => {
            this.$emit("confirm", column2);
            this.filterPopupVisible = false;
          };
        });
      }
      const wrapperListeners = {};
      if (column2.filter.showConfirmAndReset) wrapperListeners.click = e => e.stopPropagation();
      const renderComponent = () => {
        var _this$innerFilterValu2;
        if (!component) return null;
        const isVueComponent = component.install && component.component;
        if (typeof component === "function" && !isVueComponent) {
          return component((v, b) => {
            const tProps = typeof b === "object" && "attrs" in b ? b.attrs : {};
            return h2(v, {
              props: {
                ...filterComponentProps,
                ...tProps
              },
              on
            });
          });
        }
        return h(component, helper([{
          "attrs": {
            "value": (_this$innerFilterValu2 = this.innerFilterValue) === null || _this$innerFilterValu2 === void 0 ? void 0 : _this$innerFilterValu2[column2.colKey]
          }
        }, {
          "props": {
            ...filterComponentProps
          }
        }, {}, {
          "on": {
            ...on
          }
        }]));
      };
      return h("div", helper([{
        "class": this.tableFilterClasses.contentInner
      }, {
        "on": wrapperListeners
      }]), [renderComponent()]);
    };
    const getBottomButtons = (h2, column2) => {
      if (!column2.filter.showConfirmAndReset) return;
      return h("div", {
        "class": this.tableFilterClasses.bottomButtons
      }, [h(Button, {
        "attrs": {
          "theme": "default",
          "size": "small"
        },
        "on": {
          "click": () => {
            this.$emit("reset", column2);
            this.filterPopupVisible = false;
          }
        }
      }, [this.global.resetText]), h(Button, {
        "attrs": {
          "theme": "primary",
          "size": "small"
        },
        "on": {
          "click": () => {
            this.$emit("confirm", column2);
            this.filterPopupVisible = false;
          }
        }
      }, [this.global.confirmText])]);
    };
    const {
      column,
      FilterIcon
    } = this;
    if (!column.filter || column.filter && !Object.keys(column.filter).length) return null;
    const defaultFilterIcon = this.t(this.global.filterIcon) || h(FilterIcon);
    const filterValue = (_this$tFilterValue = this.tFilterValue) === null || _this$tFilterValue === void 0 ? void 0 : _this$tFilterValue[column.colKey];
    const isObjectTrue = typeof filterValue === "object" && !isEmpty(filterValue);
    const isValueTrue = filterValue && typeof filterValue !== "object";
    return h(Popup, helper([{
      "attrs": {
        "attach": this.primaryTableElement ? () => this.primaryTableElement : void 0,
        "visible": this.filterPopupVisible,
        "destroyOnClose": true,
        "trigger": "click",
        "placement": "bottom",
        "showArrow": true,
        "overlayClassName": this.tableFilterClasses.popup
      }
    }, {
      "on": {
        "visible-change": val => this.onFilterPopupVisibleChange(val)
      }
    }, {
      "class": [this.tableFilterClasses.icon, {
        [this.isFocusClass]: isObjectTrue || isValueTrue
      }],
      "attrs": {
        "content": () => h("div", {
          "class": this.tableFilterClasses.popupContent
        }, [getFilterContent(h, column), getBottomButtons(h, column)])
      }
    }]), [h("div", {
      "ref": "triggerElementRef"
    }, [this.renderLNode("filterIcon", defaultFilterIcon)])]);
  }
});

export { TableFilterController as default };
//# sourceMappingURL=filter-controller.js.map
