import { defineComponent, ref, watch, onBeforeUnmount, nextTick, createVNode } from 'vue';
import { scrollTo, waitElementReady } from '../../utils/uiUtil.mjs';
import { useInjectPanel } from '../../PanelContext.mjs';
import classNames from '../../../_util/classNames.mjs';

var TimeUnitColumn = /* @__PURE__ */ defineComponent({
  name: "TimeUnitColumn",
  props: ["prefixCls", "units", "onSelect", "value", "active", "hideDisabledOptions"],
  setup(props) {
    const {
      open
    } = useInjectPanel();
    const ulRef = ref(null);
    const liRefs = ref(/* @__PURE__ */ new Map());
    const scrollRef = ref();
    watch(() => props.value, () => {
      const li = liRefs.value.get(props.value);
      if (li && open.value !== false)
        scrollTo(ulRef.value, li.offsetTop, 120);
    });
    onBeforeUnmount(() => {
      var _a;
      (_a = scrollRef.value) == null ? void 0 : _a.call(scrollRef);
    });
    watch(open, () => {
      var _a;
      (_a = scrollRef.value) == null ? void 0 : _a.call(scrollRef);
      nextTick(() => {
        if (open.value) {
          const li = liRefs.value.get(props.value);
          if (li) {
            scrollRef.value = waitElementReady(li, () => {
              scrollTo(ulRef.value, li.offsetTop, 0);
            });
          }
        }
      });
    }, {
      immediate: true,
      flush: "post"
    });
    return () => {
      const {
        prefixCls,
        units,
        onSelect,
        value,
        active,
        hideDisabledOptions
      } = props;
      const cellPrefixCls = `${prefixCls}-cell`;
      return createVNode("ul", {
        "class": classNames(`${prefixCls}-column`, {
          [`${prefixCls}-column-active`]: active
        }),
        "ref": ulRef,
        "style": {
          position: "relative"
        }
      }, [units.map((unit) => {
        if (hideDisabledOptions && unit.disabled)
          return null;
        return createVNode("li", {
          "key": unit.value,
          "ref": (element) => {
            liRefs.value.set(unit.value, element);
          },
          "class": classNames(cellPrefixCls, {
            [`${cellPrefixCls}-disabled`]: unit.disabled,
            [`${cellPrefixCls}-selected`]: value === unit.value
          }),
          "onClick": () => {
            if (unit.disabled)
              return;
            onSelect(unit.value);
          }
        }, [createVNode("div", {
          "class": `${cellPrefixCls}-inner`
        }, [unit.label])]);
      })]);
    };
  }
});

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