import { defineComponent, ref, computed, onMounted, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, createElementVNode, renderSlot, toDisplayString, Fragment, renderList, withCtx } from 'vue';
import '../../../hooks/index.mjs';
import { Close } from '@element-plus/icons-vue';
import { UnidirectionalTransferProps, UnidirectionalTransferEmits } from './transfer2.mjs';
import './composables/index.mjs';
import TransferLeftPanel from './transfer-left-plane.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useLocale } from '../../../hooks/use-locale/index.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { useComputedData } from './composables/use-computed-data.mjs';

const __default__ = defineComponent({
  name: "ElUnidirectionalTransfer"
});
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: UnidirectionalTransferProps,
  emits: UnidirectionalTransferEmits,
  setup(__props, { emit }) {
    const props = __props;
    const leftPanel = ref();
    const { t } = useLocale();
    const ns = useNamespace("unidirectionalTransfer");
    const { targetData } = useComputedData();
    const onSourceCheckedChange = (checkedData) => {
      targetData.value = checkedData;
    };
    const removeChecked = (key) => {
      var _a;
      (_a = leftPanel.value) == null ? void 0 : _a.removeChecked(key);
    };
    const panelFilterPlaceholder = computed(() => props.filterPlaceholder || t("el.transfer.filterPlaceholder"));
    const update = (key) => {
      emit("update:modelValue", key);
      emit("change", key);
    };
    onMounted(() => {
      var _a;
      props.modelValue && leftPanel.value && ((_a = leftPanel.value) == null ? void 0 : _a.setChecked(props.modelValue));
    });
    watch(() => props.modelValue, (keys) => {
      var _a;
      (_a = leftPanel.value) == null ? void 0 : _a.setChecked(keys);
    });
    return (_ctx, _cache) => {
      const _component_el_icon = resolveComponent("el-icon");
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(unref(ns).b())
      }, [
        createVNode(TransferLeftPanel, {
          ref_key: "leftPanel",
          ref: leftPanel,
          data: props.data,
          placeholder: unref(panelFilterPlaceholder),
          filterable: _ctx.filterable,
          "filter-method": _ctx.filterMethod,
          props: props.props,
          onCheckedChange: onSourceCheckedChange,
          onChange: update
        }, null, 8, ["data", "placeholder", "filterable", "filter-method", "props"]),
        createElementVNode("div", {
          class: normalizeClass(unref(ns).b("panel"))
        }, [
          createElementVNode("p", {
            class: normalizeClass(unref(ns).be("panel", "header"))
          }, [
            renderSlot(_ctx.$slots, "searchContent", {
              length: unref(targetData).length
            }, () => [
              createElementVNode("span", null, toDisplayString(unref(t)("el.transfer.hasChecked")) + "\uFF08" + toDisplayString(unref(targetData).length) + "\uFF09", 1)
            ])
          ], 2),
          createElementVNode("div", {
            class: normalizeClass(unref(ns).be("panel", "body"))
          }, [
            createElementVNode("div", {
              class: normalizeClass(unref(ns).be("panel", "container"))
            }, [
              (openBlock(true), createElementBlock(Fragment, null, renderList(unref(targetData), (item, index) => {
                return openBlock(), createElementBlock("div", {
                  key: index,
                  class: normalizeClass(unref(ns).be("panel", "list"))
                }, [
                  createElementVNode("div", null, toDisplayString(item[props.props.label]), 1),
                  createVNode(_component_el_icon, {
                    size: "12",
                    onClick: ($event) => removeChecked(item[props.props.key])
                  }, {
                    default: withCtx(() => [
                      createVNode(unref(Close))
                    ]),
                    _: 2
                  }, 1032, ["onClick"])
                ], 2);
              }), 128))
            ], 2)
          ], 2)
        ], 2)
      ], 2);
    };
  }
});
var Transfer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/judai/code/d-element-plus/packages/components/unidirectionalTransfer/src/transfer.vue"]]);

export { Transfer as default };
//# sourceMappingURL=transfer.mjs.map
