'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../../../utils/index.cjs');
var uiUtil = require('../../utils/uiUtil.cjs');
var PanelContext = require('../../PanelContext.cjs');
var _class = require('../../../../../utils/dom/class.cjs');

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

exports.default = TimeUnitColumn;
//# sourceMappingURL=TimeUnitColumn.cjs.map
