import { defineComponent, computed, ref, onUnmounted, createVNode } from 'vue';
import '../../../utils/index.mjs';
import ResizeObserver from '../../vc-resize-observer/src/index.mjs';
import PropTypes from '../../../utils/vue/vueTypes.mjs';
import { classNames } from '../../../utils/dom/class.mjs';

const UNDEFINED = void 0;
var Item = /* @__PURE__ */ defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "Item",
  props: {
    prefixCls: String,
    item: PropTypes.any,
    renderItem: Function,
    responsive: Boolean,
    itemKey: {
      type: [String, Number]
    },
    registerSize: Function,
    display: Boolean,
    order: Number,
    component: PropTypes.any,
    invalidate: Boolean
  },
  setup(props, {
    slots,
    expose
  }) {
    const mergedHidden = computed(() => props.responsive && !props.display);
    const itemNodeRef = ref();
    expose({
      itemNodeRef
    });
    function internalRegisterSize(width) {
      props.registerSize(props.itemKey, width);
    }
    onUnmounted(() => {
      internalRegisterSize(null);
    });
    return () => {
      var _a;
      const {
        prefixCls,
        invalidate,
        item,
        renderItem,
        responsive,
        registerSize,
        itemKey,
        display,
        order,
        component: Component = "div",
        ...restProps
      } = props;
      const children = (_a = slots.default) == null ? void 0 : _a.call(slots);
      const childNode = renderItem && item !== UNDEFINED ? renderItem(item) : children;
      let overflowStyle;
      if (!invalidate) {
        overflowStyle = {
          opacity: mergedHidden.value ? 0 : 1,
          height: mergedHidden.value ? 0 : UNDEFINED,
          overflowY: mergedHidden.value ? "hidden" : UNDEFINED,
          order: responsive ? order : UNDEFINED,
          pointerEvents: mergedHidden.value ? "none" : UNDEFINED,
          position: mergedHidden.value ? "absolute" : UNDEFINED
        };
      }
      const overflowProps = {};
      if (mergedHidden.value)
        overflowProps["aria-hidden"] = true;
      return createVNode(ResizeObserver, {
        "disabled": !responsive,
        "onResize": ({
          offsetWidth
        }) => {
          internalRegisterSize(offsetWidth);
        }
      }, {
        default: () => createVNode(Component, {
          "class": classNames(!invalidate && prefixCls),
          "style": overflowStyle,
          ...overflowProps,
          ...restProps,
          "ref": itemNodeRef
        }, {
          default: () => [childNode]
        })
      });
    };
  }
});

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